html - Jquery Validate 然后 .onsubmit 函数

Question

我在表单中使用 Jquery 验证，还在 .on(submit) 代码中使用 Ajax 函数。

问题是即使验证错误，.on(submit) 函数仍然运行。

是否有任何类型的“如果验证成功”代码添加到验证代码中以放入 .on(submit) 代码，这样它只会在表单正确且经过验证时运行？

这是 .on(submit) 函数

        $('#valform').on('submit', function (e){
    e.preventDefault();
    $.ajax({
    type: "POST",
    url: "<?php echo MAXINBOUND_PLUGIN_URL ?>/php/localProxy.php",
    data: $('#valform').serialize(),
    success: function (response) {
            alert('Great!');
             // do something!
    },
    error: function () {
            alert('There was a problem!');  // handle error
    }
        });
        });

这是验证码

    $("#valform").validate({
    invalidHandler: function(form, validator) {
        success: function (response) {
        var errors = validator.numberOfInvalids();

        if (errors) {
            $("#error-message").show().text("Please correct the required field(s)");
        } else {
            $("#error-message").hide();
        }
    },
    messages: {
        agree: {
            required: ""
        },
        phone1: {
            required: ""
        },
        address1: {
            required: ""
            },
    },
    rules: {
        agree: {
            required: true,
        },
        phone1: {
            required: true,
            phoneUS: true
        },
        Address1: {
            required: true,
            addr: true,
            },

        },

     });

Answer 1

您可以使用submitHandler进行 ajax 调用。所以它只会在通过所有验证后调用。

$("#valform").validate({
   submitHandler: function(form) {
     //do ajax call
   }
})

Answer 2

您可以使用jquery valid() 方法来检查提交的表单是否有效。像这样的东西...

if ($("#valform").valid()) {
    // do your ajax stuff
}

请注意，valid()仅在之前的表单上调用validate()时才有效。

希望这可以帮助！