Javascript document.getElementById().value 与文本框值不匹配答案

【问题标题】：Javascript document.getElementById().value not matching textbox valueJavascript document.getElementById().value 与文本框值不匹配
【发布时间】：2013-11-17 20:01:00
【问题描述】：

我正在尝试使用 Javascript 制作一个简单的密码确认脚本。我是 Javascript 和 Web 开发的新手，所以任何帮助都会有所帮助。

我想比较两个文本输入（最终是密码输入），如果两者相等，则启用提交按钮。使用 StackOverflow 和 W3 教程，我总结了以下几点：

<head>
<script>
function displayPass()
{
document.getElementById("complete").innerHTML="Password recorded.<br>Pass1 = " + document.getElementById("pass1").value + ".<br>Pass2 = " + document.getElementById("pass2").value + ".";
}
function checkpass()
{
    document.getElementById("pass1out").innerHTML = document.getElementById("pass1").value;
    document.getElementById("pass2out").innerHTML = document.getElementById("pass2").value;
    if(document.getElementById("pass1").value==document.getElementById("pass2").value){
        document.getElementById("subbutton").disabled = false;
    } else {
        document.getElementById("subbutton").disabled = true;
    }
}
</script>
</head>
<body>

<table border=0 cellpadding=0 cellspacing=5>
<tr><td>Password</td><td><input id="pass1" type=text onkeypress="checkpass()"></input></td><td id=pass1out></td></tr>
<tr><td>Confirm</td><td><input id="pass2" type=text onkeypress="checkpass()"></input></td><td id=pass2out></td></tr>
<tr><td></td><td><button type="button" id="subbutton" onclick="displayPass()" disabled>Submit</button></td></tr>
</table>
<p id="complete">&nbsp</p>
</body>

我注意到的是，在 checkpass() 函数的文本框中找到的值与文本框中的实际值不匹配。后面好像是一个角色。

当按钮启用并单击提交时，displayPass() 中的值是正确的，并且与文本框中的值匹配。

我不知道我是否遗漏了一些简单的东西，或者我是否更深入地使用了 Javascript。我看过他们推荐使用 jQuery 的类似帖子，但我还没有使用 jQuery。

【问题讨论】：

使用keyup 而不是keypress。你说得对，它是一个角色，但是 keyup 事件发生在值更新之后。
太棒了，效果很好！谢谢。
没问题。很高兴帮助:)

标签： javascript jquery html input passwords

【解决方案1】：

您可以使用以下代码获得所需的输出：

<html>
<head>
<script>
function displayPass()
{
document.getElementById("complete").innerHTML="Password recorded.<br>Pass1 = " +      document.getElementById("pass1").value + ".<br>Pass2 = " + document.getElementById("pass2").value + ".";
}
function checkpass()
{
document.getElementById("pass1out").innerHTML = document.getElementById("pass1").value;
document.getElementById("pass2out").innerHTML = document.getElementById("pass2").value;
if(document.getElementById("pass1").value==document.getElementById("pass2").value){
    document.getElementById("subbutton").disabled = false;
} else {
    document.getElementById("subbutton").disabled = true;
}
}
</script>
</head>
<body>

<table border=0 cellpadding=0 cellspacing=5>
<tr><td>Password</td><td><input id="pass1" type=text onkeyup="checkpass()"></input></td><td id=pass1out></td></tr>
<tr><td>Confirm</td><td><input id="pass2" type=text onkeyup="checkpass()"></input></td><td id=pass2out></td></tr>
<tr><td></td><td><button type="button" id="subbutton" onclick="displayPass()" disabled>Submit</button></td></tr>
</table>
<p id="complete">&nbsp</p>
</body>
<html>

用户“onkeyup”而不是“keypress”

【讨论】：

“给我声望！”不能怪你。