在 HTML5 中想要验证密码并确认密码答案

【问题标题】：In HTML5 want to validate password and confirm password在 HTML5 中想要验证密码并确认密码
【发布时间】：2014-02-03 05:17:07
【问题描述】：

我想在 HTML5 中验证密码并确认密码。通过使用所需的功能，我已经验证了空值。但无法验证密码和确认密码

HTML：

<form id="registration" name="registration" action="registrationaction.php" method="POST">
<input type="password" class="agent-input registerinput" name="pswd" id="pswd">
<input type="password" class="agent-input registerinput " name="confirmpassword" id="confirmpassword">
</form>

JavaScript：

<script>
$().ready(function() 
{
    $("#registration").validate({
            rules:  pswd: {
                    required: true
                },
                            confirmpassword: {
                    required: true
                },
            },
            messages
                pswd: "Please enter password",
                            confirmpassword: "Please enter valid confirm password",                   
            },      
            submitHandler: function() { $('#registration').submit(); }
        });
    });

【问题讨论】：

在 jquery 中编写逻辑...
使用$(document).ready(function() { // code here })你没有写document关键字。
是的，您可以通过 jquery 获取某个变量中的值来检查两者是否相等。
还请注意，这种验证实际上没有任何意义，除了作为用户的便利因素之外，因为它是客户端。还包括来自服务器端的这项检查。
你看到@user2727841的代码了吗...

标签： javascript jquery html

【解决方案1】：

有几种方法可以确认两个密码匹配。但是，假设您想使用 jQuery Validation Plugin（您的问题似乎使用了），将您的 Javascript 代码更改为此即可：

$().ready(function(){
    $("#registration").validate({
        rules: { 
            pswd: {
                required: true
            },
            confirmpassword: {
                required: true,
                equalTo: "#pswd"
            }
        },
        messages: {
            pswd: "Please enter password",
            confirmpassword: "Please enter valid confirm password"
        },      
        submitHandler: function() { $('#registration').submit(); }
    });
});

我应该指出您的 Javascript 示例有几个问题（未闭合的括号等）。它们已在上面的示例中得到纠正。

如果您可以使用 jQuery Validation Plugin 创建更多精彩内容，请务必查看their documentation webpage 以获得易于阅读的可用选项列表。

附：对于坚持必须更改 $().ready() 的每个人，我想指出，根据jQuery documentation，它是完全有效的语法（虽然不推荐，但它是有效的）。

【讨论】：

我必须重申 Andrew Brown 在之前的评论中所说的话。强烈建议也进行服务器端检查。如果访问者的 Web 浏览器未启用 Javascript，则整个验证代码块将根本不会运行。实施 Javascript 检查对于普通访问者来说既方便又完美，但对于那些边缘情况，进行这些服务器端检查也很重要。我建议研究“服务器端表单验证教程”以了解它是如何完成的。
另外，很高兴听到它有帮助！如果此答案或任何其他答案解决了您的问题，请将其标记为已接受。谢谢。

【解决方案2】：

您应该在适当的 ready() 函数中编写代码。我认为您提供的代码一定会引发错误。无论如何，有两种正确的方法是：

$( document ).ready(function() {
    //your code comes here
});


$(function() {
    //your code comes here
});

您可以在其中编写表单验证代码。请明确您只能使用 JavaScript 来做到这一点。

【讨论】：

【解决方案3】：

$(document).ready(function() {
    $("#registration").validate({
            rules:  pswd: {
                    required: true
                },
                            confirmpassword: {
                    required: true
                },
            },
            messages
                pswd: "Please enter password",
                            confirmpassword: "Please enter valid confirm password",                   
            },      
            submitHandler: function() { $('#registration').submit(); }
        });
    });

或

$(function() {
   $("#registration").validate({
            rules:  pswd: {
                    required: true
                },
                            confirmpassword: {
                    required: true
                },
            },
            messages
                pswd: "Please enter password",
                            confirmpassword: "Please enter valid confirm password",                   
            },      
            submitHandler: function() { $('#registration').submit(); }
        });
});

函数$(document).ready(function() { // code here }); 和$(function() { // code here }); 是等价的。 不要忘记为服务器端验证编写代码！！！

【讨论】：