我的 HTML 文件中有这段代码:
<div class="first">
<label> Enter Password: </label>
<input type="text" name="pword1" class="iBox" id="pword1" onmouseout="HideToolTip()" onmouseover="ShowToolTip()" onkeyup="allFunctions()" placeholder="choose a password" autocomplete="off">
<p id="tooltipbox" style="visibility:hidden">This is the tooltip</p>
</div>
<div class="second">
<label> Confirm Password: </label>
<input type="text" name="cPassword" class="iBox" id="cPassword" onkeyup="passwordValidation()" placeholder="confirm it!" autocomplete="off">
<p id="combination"></p>
</div>
<div class="third">
<input type="submit" id="submitButton" value="submit" disabled="disabled" onmouseout="SubmitToolTipHide()" onmouseover="SubmitToolTip()">
<p id="subTT" style="visibility:hidden">Passwords do not match</p>
</div>
这些是我的功能:
function ShowToolTip(){
document.getElementById("tooltipbox").style.visibility = 'visible';
}
function HideToolTip(){
document.getElementById("tooltipbox").style.visibility = 'hidden';
}
function SubmitToolTip(){
document.getElementById("subTT").style.visibility = 'visible';
}
function SubmitToolTipHide(){
document.getElementById("subTT").style.visibility = 'hidden';
}
当我将鼠标悬停在密码的文本区域上时,工具提示会正确显示,而当我将鼠标移出该区域时,工具提示会正确消失。 我不明白为什么,用同样的逻辑,当我将鼠标悬停在提交按钮上时,它不会出现在提交按钮上。尽管我使用了相同的 Javascript 函数。
最佳答案
这是因为您的提交按钮被禁用了。如果您删除 disabled="disabled"它将起作用。在该代码中,在密码字段更改时进行检查并显示/隐藏工具提示可能是有意义的,而不是在悬停时 - 并且只禁用提交按钮,直到它们匹配。
关于javascript - 工具提示不适用于提交按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28113198/