javascript - AJAX:在没有页面刷新的情况下提交表单只能工作一次

Question

我正在使用 AJAX 在后台提交表单，而不刷新页面。我遇到的问题是我只能提交一次表格。在我提交一次后，on('submit') 函数不再有效，我也没有收到任何错误。这完全违背了使用 AJAX 提交表单的目的:/

           $(document).on('submit', '#myForm', function(e) {
                $.post('mail.php', $(this).serialize(), function (data) {
                    //SUCCESS
                    $('.successORfail').html(data);
                     setTimeout(function(){
                      $(".successORfail").fadeOut("slow", function () {
                        $(".successORfail").remove();
                      });
                    }, 4500);

                }).error(function() {
                    alert("Fatal Error: mail.php not found!");
                });
                e.preventDefault();
            });

不知道有没有人遇到过类似的问题，或者知道怎么解决的？如果需要，我希望能够多次提交表单，并在每次提交后更改表单输入值。

提前致谢

Answer 1

您确定 AJAX 请求没有发生吗？看起来您正在从页面中删除 .successORfail 元素，因此在后续调用中没有任何内容可追加。

检查您的控制台，您可能会注意到每次都会发生 ajax 调用。

尝试将您的 setTimeout 更改为:

var msgEl = $(".successORfail");
setTimeout(function() {
    msgEl.fadeOut("slow", function () {
        msgEl.empty().show();
    });
}, 4500);