如何在HTML表单中使用工具提示?

时间:2014-12-01 17:14:12

标签: javascript html function

我正在youtube https://www.youtube.com/watch?v=yqKrCQcsaAA上关注此工具提示教程,并认为我已将其钉入,但当我使用工具提示功能时,它正在删除我的输入框。

这是我的代码:

<input type="text" name="pword1" class="iBox" id="pword1" autocomplete="off"  onmouseout="HideToolTip()" onmouseover="ShowToolTip()" onkeyup="reqMetVal()" placeholder="choose a password" >

function ShowToolTip(){
    document.getElementById("pword1").style.visibility = 'visible';
}

function HideToolTip(){
    document.getElementById("pword1").style.visibility = 'hidden';
}

然后当我将其激活到浏览器中进行测试时,当我将鼠标悬停在输入框上时,它会消失并且只能通过刷新页面并将其标记到其中来进入

1 个答案:

答案 0 :(得分:0)

您真正需要做的是了解代码正在做什么。你现在的方式,你可以盲目地复制并粘贴一个后门直接进入你的网站,发现你的服务器被黑了,你不知道你做了什么。 (这就是最近&#34; social.png&#34; hacks最近如此常见的原因。)

代码的功能部分是:

  • onmouseout="HideToolTip()"
  • onmouseover="ShowToolTip()"

HideToolTip获取ID为pword1的元素并隐藏它。 pword1是您的输入元素,如代码中的id="pword1"属性所示。

所以基本上,当你将鼠标移出盒子时,它会消失。你不能mouseover隐藏元素,因此无法取回它。

从你的问题中确切地说出你打算做什么是不可能的,但也许这就是它?

&#13;
&#13;
function ShowToolTip(){
    document.getElementById("tooltipbox").style.visibility = 'visible';
}

function HideToolTip(){
    document.getElementById("tooltipbox").style.visibility = 'hidden';
}
&#13;
<input type="text" name="pword1" class="iBox" id="pword1" autocomplete="off"  onmouseout="HideToolTip()" onmouseover="ShowToolTip()" onkeyup="reqMetVal()" placeholder="choose a password" >
<p id="tooltipbox" style="visibility:hidden">This is the tooltip</p>
&#13;
&#13;
&#13;