用jquery validate插件实现强密码验证

时间:2022-01-26 20:34:01

用户修改密码时,新密码必须至少一个大写字母、一个小写字母及一个符号组成,实现强制强密码。

javascript代码:

$(function() {


            $("#form1").validate({
                rules: {
                    txbOldPwd: 'required',
                    txbNewPwd1:
                {
                    required: true,
                    regexPassword: true,
                    same:true
                },
                    txbNewPwd2: { required: true, rangelength: [8, 15], equalTo: "#txbNewPwd1" }


                },




                messages: {
                    txbOldPwd: '请输入老密码',
                    txbNewPwd1:
                {
                    required: '请输入新密码',
                    regexPassword: '密码至少包一个大写字母、一个小写字母及一个符号,长度至少8位',
                    same:'新密码不能与老密码一样'
                },
                    txbNewPwd2: {
                        required: "请输入确认密码",
                        rangelength: "确认密码不能小于8个字符",
                        equalTo: "两次输入密码不一致"
                    }


                },


                errorElement: "em", //可以用其他标签,记住把样式也对应修改
                success: function(label) {
                    //label指向上面那个错误提示信息标签em
                    label.text(" ")//清空错误提示消息
.addClass("success"); //加上自定义的success类
                }


            });


            jQuery.validator.addMethod("same", function(value, element) {
                return this.optional(element) || same(value);
            }, "新密码不能与老密码重复");


            function same(pwd) {
                var oldPwd = $("#txbOldPwd").val();
                if (oldPwd == pwd)
                    return false;
                else
                    return true;
            }

// 密码验证正则表达式
jQuery.validator.addMethod("regexPassword", function(value, element) {
return this.optional(element) || /^(?=^.{8,}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$/.test(value);
}, "一个大写,一个小写,一个符号");



        })
    


aspx

<form id="form1" runat="server">
<div style="text-align:center" >
<div class="Body_Title">用户管理 >> 修改密码</div>
<div class="kuang">
<table style="line-height:40px">
<tr>
<td class="tdLeft" width=30%>老密码:</td>
<td class=tdRight>
<asp:TextBox ID="txbOldPwd" runat="server" Width=180px title="输入旧密码" TextMode="Password"
></asp:TextBox><em>*</em>
</td>
</tr>
<tr>
<td class="tdLeft">新密码:</td>
<td class=tdRight>
<asp:TextBox ID="txbNewPwd1" runat="server" Width=180px title="输入新密码"
TextMode="Password"></asp:TextBox>
</td>
</tr>
<tr>
<td class="tdLeft">新密码确认:</td>
<td class=tdRight>
<asp:TextBox ID="txbNewPwd2" runat="server" Width=180px title="新密码确认"
TextMode="Password"></asp:TextBox>
</td>
</tr>
<tr>
<td style="line-height:40px; text-align:center" colspan="2">
<asp:Button ID="Button1" runat="server" Text="修 改" CssClass="btn" />
</td>
</tr>
</table>
</div>
</div>
</form>