验证后提交Ajax（jQuery Mobile+；验证器）

我很难让它工作。它按预期验证字段，但无论我做什么尝试，都无法正确钩住提交

这是我的表格：

<form action="" id="m-frm-contact_us" class="m-contact_submit" method="post" data-ajax="false">
  <input type="text" name="firstName" placeholder="FIRST NAME" title="" id="first" class="contact full required" minlength="2" maxlength="36" />
  <input type="text" name="lastName" placeholder="LAST NAME" id="last" class="contact full required" minlength="2" maxlength="36" />
  <input type="email" name="mail" placeholder="E-MAIL ADDRESS" id="mail" class="contact full required email" />
  <button type="submit" name="submit_contact" value="clicked">Submit</button>
</form>

我在控制台中得到的唯一东西是“提交事件已触发”，在表单提交中调用。尽管我做了很多努力，表单总是试图自己发布，重新加载页面

我想在提交时执行此代码：

var contact = {
    submit : function(){
        console.log('Form is being submitted.');
        var _this = this,
        post = $.post("/path/to/submit.php", $("#m-frm-contact_us").serialize(), function(response){
            try{
                if(response==1) {
                    _this.passed();
                } else {
                    _this.error();
                }
            }
            catch(e){
                if(typeof e == 'string') console.log(e);
                _this.error();
            }
        });
    },
    error : function(){ $.mobile.changePage("#error"); },
    passed : function(){ $.mobile.changePage("#passed"); }
}

---

我遗漏了什么？

我重新构建了JS，并且能够让它正常工作。以下是代码，以防任何人遇到类似问题：

表格：

---

我没有让验证器处理提交事件，而是参考验证的状态，并在验证无误时运行ajax。在我以前的方法中，提交事件是不可靠的，我感觉调用ajax函数时失去了作用域。

var contact = {
    submit : function(){
        console.log('Form is being submitted.');
        var _this = this,
        post = $.post("/path/to/submit.php", $("#m-frm-contact_us").serialize(), function(response){
            try{
                if(response==1) {
                    _this.passed();
                } else {
                    _this.error();
                }
            }
            catch(e){
                if(typeof e == 'string') console.log(e);
                _this.error();
            }
        });
    },
    error : function(){ $.mobile.changePage("#error"); },
    passed : function(){ $.mobile.changePage("#passed"); }
}

<form action="" method="post" id="m-frm-contact_us" novalidate="novalidate">
    <input type="text" name="firstName" placeholder="FIRST NAME" title="" id="first" class="contact full required placeholder noSpecial" minlength="2" maxlength="36">
    <input type="text" name="lastName" placeholder="LAST NAME" id="last" class="contact full required placeholder" minlength="2" maxlength="36">
    <input type="email" name="mail" placeholder="E-MAIL ADDRESS" id="mail" class="contact full required email">
    <button type="submit" name="submit_contact" value="clicked">Submit</button>
</form>

$.validator.addMethod('noPlaceholder', function(value, element) {
    return value !== element.defaultValue;
}, 'This field is required.');
$.validator.addMethod(
    'placeholder', function(value, element) {
        return value != $(element).attr("placeholder");
    }, 'This field is required.'
);
$.validator.addMethod("regex", function(value, element, regexp) {
    var check = false;
    var re = new RegExp(regexp);
    return this.optional(element) || re.test(value);
}, "No special Characters allowed here. Use only upper and lowercase letters (A through Z; a through z)");

$('#m-frm-contact_us').submit(function(event) {
    event.preventDefault();

    if($(this).validate({
        rules : {
            first_name : {
                required : true,
                maxlength : 36,
                regex : /^[A-Za-z\s`'"\\-]+$/
            },
            last_name : {
                required : true,
                maxlength : 36,
                regex : /^[A-Za-z\s`'"\\-]+$/
            }
        }
    }).form()) {
        var $form = $(this), formData = {
            firstName : $form.find('#first').val(),
            lastName : $form.find('#last').val(),
            mail : $form.find('#mail').val()
        };
        $.post('/path/to/submit.php', formData, function(response) {
            if(response == 1) {
                $.mobile.changePage("#passed");
            } else {
                $.mobile.changePage("#error");
            }
        })
    };

    return false;
})