lay-verify 无效

lay-verify 无效

使用lay-verify有两个需要注意的地方:

  • form标签需要添加 class="layui-form"
  • 提交按钮需要添加 lay-submit=""

如:

<form action="#" method="post" class="layui-form">
    <input id="login-username" type="text" name="username" placeholder="Username" lay-verify="required|username">
    <input id="login-password" type="password" name="password" placeholder="Password" lay-verify="required|password">
    <input class="layui-btn layui-btn-fluid layui-btn-normal " lay-submit="" type="button" value="Login" lay-filter="login-submit">
</form>
<script type="text/javascript">
    layui.use(['layer', 'form'], function () {
        var layer = layui.layer;
        var form = layui.form;
        form.verify({
            username: function (value, item) {
                //value:表单的值、item:表单的DOM对象
                if (!new RegExp("^(.+){4,18}$").test(value)) {
                    return '用户名长度必须为4-18位'
                }
                if (!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)) {
                    return '用户名不能有特殊字符';
                }
                if (/(^\_)|(\__)|(\_+$)/.test(value)) {
                    return '用户名首尾不能出现下划线\'_\'';
                }
                if (/^\d+\d+\d$/.test(value)) {
                    return '用户名不能全为数字';
                }
            },
            password: [
                /^[\S]{6,18}$/,
                '密码必须6到12位,且不能出现空格'
            ],
            confirm_password: function (value) {
                if (!new RegExp("^[\\S]{6,18}$").test(value)) {
                    return '密码长度必须为6-18位'
                }
                if (value !== $('#login-password').val()) {
                    return '两次输入的密码不一致';
                }
            }
        });

         form.on('submit(login-submit)', function (data) {
            var login_username = $("#login-username");
            var login_password = $("#login-password");
            var username = login_username.val();
            var password = login_password.val();
            password = md5(password);

            $.ajax({
                url: "/XXX/login/",
                type: "POST",
                data: {
                    username: username,
                    password: password,
                    csrfmiddlewaretoken: '{{ csrf_token  }}'
                },
                async: false,
                success: function (data) {
                    var status = data.status;
                    if (status === 0) {
                        $("#myModal").modal('hide');
                        layer.msg("Login Success!", {offset: '200px'});
                        // todo something after login
                    } else if (status === 21) {
                        // user not exist
                        layer.msg(data.msg, {offset: '200px'});
                        login_username.val("");
                        login_password.val("");
                        login_username.focus();
                    } else if (status === 22) {
                        // wrong password
                        layer.msg(data.msg, {offset: '200px'});
                        login_password.val("");
                        login_password.focus();
                    } else {
                        layer.msg(data.msg, {offset: '200px'});
                    }
                },
                error: function () {
                    layer.msg("System Service Busy!", {offset: '200px'});
                }
            });
            return false;
        });
    });
</script>
  • 8
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 5
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值