Question

我正在使用jQuery覆盖html表单的提交事件：

event.preventDefault()

$('#contact-form').submit(function(event) { event.preventDefault(); asyncValidationHere(function(valid) { if(!valid) { return; } // Turn off the custom form submit event handler now since valid $('#contact-form').off('submit'); // Submit (do the actual form post) $('#contact-form').submit(); }); });暂时阻止实际的表单发布。在我做了一些异步验证之后，我希望强制再次提交表单：

$('#contact-form').off('submit')

Howerver我没有看到这张表格。似乎在调用$('#contact-form').submit()，然后尝试提交{{1}}无效。

有什么想法吗？

Answer 1

$('#contact-form').on("submit", function(event) {
    event.preventDefault();

    var that = this; // that is the form

    asyncValidationHere(function(valid) {
        if(!valid) { return; }

        $(that).off("submit"); // to guarante the function won't be invoked

        that.submit(); // submit the form
    });
});

注意： that.submit();（不要与jQuery.submit混淆）在节点（表单）上调用，它会提交表单（这里是{ {3}}）。

Answer 2

您可以从异步函数内部触发提交事件，并传递一些成功标记。然后，在提交事件的处理程序内，您可以根据该标志是否存在来调用preventDefault。类似的东西：

$('#contact-form').submit(function(event) {

    if (!event.data.valid) {

        event.preventDefault();

        asyncValidationHere(function(valid) {
            if(!valid) { return; }

            // Submit (do the actual form post)
            $('#contact-form').trigger('submit', {valid: true});
        });
    }
});

jQuery表单提交阻止默认操作，然后提交

2 个答案: