在javascript/HTML中显示工具提示

Question

我有一个HTML表格与文本框和一个按钮，最初文本框是隐藏的，按下按钮后，它将显示。这个可以完美地工作。我需要做的是在文本框的右侧显示一个工具提示，上面写着"Enter your name here“，同时文本框也会出现。(当鼠标悬停在文本框上时不会。文本框出现时需要显示工具提示)

有谁能帮我解决这个问题吗？

到目前为止，这是我的代码。

<html>
<head>
    <script>
        function showRow(rowId) {
            document.getElementById(rowId).style.display = "";
        }
    </script>
</head>
<body>
    <table>
        <tr id="r1">
            <td>
                <input type="button" id="click" name="click" value="click" onclick="showRow('r2');"/>
            </td>
        </tr>
        <tr id="r2" style="display: none;">
            <td>
                <input type="text" id="name" name="name"/>
            </td>
        </tr>
    </table>
</body>
<html>

Answer 1

如果您希望同时显示“工具提示”，则只需添加一个元素作为<td>元素的子元素。

发自：

<tr id="r2" style="display: none;">
    <td><input type="text" id="name" name="name"></td>
</tr>

至：

<tr id="r2" style="display: none;">
    <td>
        <input type="text" id="name" name="name">
        <label for="name">My Label</label>
    </td>
</tr>

希望这能行得通。(我不知道你是不是在问这个)

检查我刚刚创建的这个JSFiddle：

https://jsfiddle.net/0mfk3tr3/