Question

我正在尝试用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（）中的值是正确的，并且与文本框中的vaules相匹配。

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

Answer 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”

Javascript document.getElementById（）。值与文本框值不匹配

1 个答案: