jquery - 表单验证不会发生并且表单提交

Question

这是我正在处理的登录页面的 javascript。所以由于某种原因，我的表单在发送表单之前没有验证，而且它也破坏了我的背景旋转插件。希望有人能帮我解决这个问题，对不起，如果这篇文章太长了，我似乎无法正确提交这篇文章，因为它一直要求我添加更多细节，但我真的不知道是什么否则要添加。

var Login = function () {

    return {
        //main function to initiate the module
        init: function () {

            $.backstretch([
                "assets/img/bg/1.jpg",
                "assets/img/bg/2.jpg",
                "assets/img/bg/3.jpg",
                "assets/img/bg/4.jpg"
                ], {
                  fade: 1000,
                  duration: 8000
              });

            $('.login-form').submit(function(e) {
            e.preventDefault();
            }).validate({
                errorElement: 'label', //default input error message container
                errorClass: 'help-inline', // default input error message class
                focusInvalid: false, // do not focus the last invalid input
                rules: {
                    username: {
                        required: true
                    },
                    password: {
                        required: true
                    },
                    remember: {
                        required: false
                    }
                },

                messages: {
                    username: {
                        required: "Username is required."
                    },
                    password: {
                        required: "Password is required."
                    }
                },

                invalidHandler: function (event, validator) { //display error alert on form submit   
                    $('.alert-error', $('.login-form')).show();
                },

                highlight: function (element) { // hightlight error inputs
                    $(element)
                        .closest('.control-group').addClass('error'); // set error class to the control group
                },

                success: function (label) {
                    label.closest('.control-group').removeClass('error');
                    label.remove();
                },

                errorPlacement: function (error, element) {
                    error.addClass('help-small no-left-padding').insertAfter(element.closest('.input-icon'));
                },

                submitHandler: function (form) {
                    $.ajax({
                    url: "loginqry.php",
                    type: "post"
                    data: serializedData
                    {
                    alert(data); // show response from the php script.
                    }
                    })；
                    return false;
                }
            });

            $('.login-form input').keypress(function (e) {
                if (e.which == 13) {
                    $.ajax({
                    url: "loginqry.php",
                    type: "post"
                    data: serializedData
                    {
                    alert(data); // show response from the php script.
                    }
                    })；
                    return false;
                }
            });
        }

    };

}();

Answer 1

您不能将该.validate()方法链接到事件处理程序...

$('.login-form').submit(function(e) {
    e.preventDefault();
}).validate({...});

此外，首先没有理由声明.submit()处理程序。该插件会自动处理您绑定到的表单的提交事件。

只需这样做...

$('.login-form').validate({...});