Làm cách nào để trì hoãn biểu mẫu gửi

Question

Tôi có chức năng bổ sung để thực thi trước khi tôi gửi biểu mẫu. Đây không phải là việc làm.

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

    event.preventDefault(); 

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

}); 

Điều này không rõ ràng.

Answer 1

Bạn cần kích hoạt sự kiện trên chính phần tử biểu mẫu, chứ không phải trên lựa chọn jQuery. (Trong thực tế, bạn thậm chí không được chọn các yếu tố hình thức - bên setTimeout, this là đối tượng toàn cầu.)

cache một tham chiếu đến các hình thức (this) và gọi phương thức submit của nó:

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

    event.preventDefault(); 

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

Lưu ý rằng tôi cũng đã thay thế cuộc gọi $(this).attr('id') không hiệu quả của bạn với this.id. Cũng lưu ý rằng bạn phải gọi phương thức gửi của phần tử biểu mẫu DOM, không phải phương thức jQuery, để trình xử lý sự kiện jQuery không được kích hoạt, điều này sẽ gây ra một vòng lặp vô hạn (và hoàn toàn không hiệu quả).

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

Cố gắng hủy liên kết sự kiện gửi và trong setTimeout, hãy tham khảo "this" thay vì cửa sổ.

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

Answer 4

Đó là do sự kiện gửi được gọi đi lặp đi lặp lại nhưng đang ngăn việc gửi vì ngăn chặnDefault. Hoặc hủy liên kết sự kiện gửi sau khi chức năng của bạn đã được thực hiện hoặc sử dụng giá trị boolean để đặt và kiểm tra xem nó đã được thực thi hay chưa.

Answer 5

bạn có thể đặt một callback trong chức năng của bạn

$('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 6

Cũng có thể với phương pháp jquery chậm trễ:

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

Answer 7

một mã nhỏ để trì hoãn hình thức nộp như sau

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

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