Question

在提交表单之前，我还有一个额外的功能要执行。这不是诀窍。

$('form').submit( function(event) {
    var formId = $(this).attr('id');
    mySpecialFunction(formId);

    event.preventDefault();

    setTimeout( function () { 
        $(this).submit();
    }, 300);

});

这显然不起作用。

Answer 1

您需要在表单元素本身上触发事件，而不是在jQuery选择上触发事件。（事实上，你甚至没有选择表单元素 - 在setTimeout内，this是全局对象。）

缓存对表单（this）的引用并调用其submit方法：

$('form').submit( function(event) {
    var formId = this.id,
        form = this;
    mySpecialFunction(formId);

    event.preventDefault();

    setTimeout( function () { 
        form.submit();
    }, 300);
});

请注意，我还使用$(this).attr('id')替换了效率低下的this.id来电。另请注意，您必须调用DOM表单元素的提交方法，而不是jQuery方法，以便不触发jQuery事件处理程序，这将导致无限（并且完全无效）循环。

Answer 2

$('form').submit( function(event) {
    var formId = this.id,
              $this = $(this);

    mySpecialFunction(formId);

    event.preventDefault();
    $this.unbind("submit");
    setTimeout( $.proxy( $.fn.submit, $this ), 300);

});

Answer 3

尝试取消绑定提交事件，并在setTimeout中引用正确的“this”而不是窗口。

$(this).unbind("submit");
var self = this;
setTimeout( function () { 
  $(self).submit();
}, 300);

Answer 4

您可以在函数中设置回调

$('form').submit( function(event) {
    var formId = $(this).attr('id');

    mySpecialFunction(formId, $(this).doWhatever(formId );

    event.preventDefault();
});

function mySpecialFunction(id, onComplete) {

    if ($.isFunction(onComplete)) {
        onComplete.call(this);
    }
}

Answer 5

那是因为提交事件被反复调用，但由于preventDefault而阻止了提交。在执行函数后取消绑定提交事件，或使用布尔值设置并检查它是否已经执行。

Answer 6

也可以使用jquery延迟方法：

$(function() {
    $('#the_form').delay(300).submit();
});

Answer 7

延迟表单提交的另一个小代码如下

$('form').submit(function (e) {
    var form = this;
    e.preventDefault();
    setTimeout(function () {
        form.submit();
    }, 1000); // in milliseconds

    $("<p>Delay...</p>").appendTo("body");
});

如何延迟提交表单

7 个答案: