javascript – 如何将我的表单与document.querySelector相关联？

我不知道如何将以下条件反应链接到passid表单输入id：

我不知道将document.querySelector放在何处,以便索引的contion-reactions将与之关联.

这是代码：

<!doctype html>
<html>
    <head>
        <Meta charset="utf-8">
        <title>Password - form</title>
    </head>
 
    <body>
 
        <form>
            <label>Password</label>
            <input type="password" id="passid" />
            <br>
            <input type="submit" value="Sign In" />
        </form>
 
        <script>
 
            function passType() {
                var password = ["p1","p2","p3","p4","p5"];
 
                if (password.indexOf > -1) {
                    alert("That's great! Thank you!");
                } else {
                    alert("Wrong,try again");
                }
 
                if (password.indexOf > -1) {
                    alert("It's wrong,you have one more try...");
                } else {
                    alert("Get out now!");
                    window.close();
                }
            }
        passType();
 
    </script>
    </body>
</html>

解决方法

我想你问的是如何获得用户输入密码字段的值.那是document.getElementById(“passid”).value.所以你会写：

if (password.indexOf(document.getElementById("passid").value) > -1) {
    alert("That's great! Thank you!");
}

请注意,在脚本的顶级调用passType()将不起作用.这将在首次加载页面时运行,而不是等待用户填写密码.您应该在用户提交表单时调用它.你应该做：

document.querySelector("form").addEventListener("submit",passAll);

您还应该更改passAll()函数,以便在用户输入错误密码时调用Event.preventDefault(),以防止提交表单.看到

return false on addEventListener submit still submits the form?

此外,在客户端Javascript中检查密码不是很安全.没有什么能阻止用户修改脚本或绕过脚本.应在服务器上检查密码,以便用户无法覆盖密码.

javascript – 如何将我的表单与document.querySelector相关联？

解决方法

猜你在找的JavaScript相关文章