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

Question

我想在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(); }
        });
    });

Answer 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创建，绝对记得要查看他们的文档网页，以获得易于阅读的可用选项列表。

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

Answer 2

您应该在适当的ready（）函数中编写代码。 我认为你提供的代码必须抛出错误。 无论如何，两种正确的方法是：

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


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

在这些内部，您可以编写表单验证代码。 请注意， 您只能使用JavaScript执行此操作 。

Answer 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 }); 是等价的。 不要忘记为服务器端验证代码 ！