连续的AJAX调用增加了一个额外的连续调用

问题是，每次你点击act按钮，你调用$("form").submit(), which adds another提交handler to the form. So if you click on the行为按钮3次，然后点击表单的提交按钮，它会发送3 AJAX请求。

将一个事件处理程序绑定到另一个事件处理程序中几乎总是错误的，你应该在顶层绑定所有的事件处理程序。

var icon;
$(document).ajaxStart(function() {
    if (icon) {
        icon.show();
    }
});
$('button[name=act]').click(function() {
    icon = $(this).closest('div.thumbnail').find('i');
});
$("form").submit(function (e) {
    e.preventDefault();
    var formData = new FormData($(this)[0]);
    $.ajax({
        url: "ajax/acttdb",
        data: formData,
        dataType: "json",
        type: "POST",
        cache: false,
        contentType: false,
        processData: false,
        success: function (data, status, jqXhr) {
            if (icon) {
                icon.fadeIn(function() {
                    $(this).removeClass('fa-spinner fa-spin').addClass('fa-check text-success').fadeOut(1000, function() {
                        $(this).removeClass('fa-check text-success').addClass('fa-spinner fa-spin');
                    });
                });
            }
        }/*,
           error: function (jqXhr, textStatus, errorThrown) {
           console.log("Error response:", jqXhr.responseText);
           }*/
    });
});

发生这种情况的原因是因为每次单击按钮时都重新绑定提交事件函数，这会导致该函数的多个副本。只要把它移出点击，如果你想在点击时强制提交，你可以调用submit()函数，不带参数来触发事件。

尝试以下操作:

$(function(){
    $('button[name=act]').click(function(){
        var icon = $(this).closest('div.thumbnail').find('i');
        $(document).ajaxStart(function()
        {
            icon.show();
        });
        $("form").submit(); //This submits the form on click
    });
    //This binds the function, so it should only be called once.
    $("form").submit(function (e)
    {
        e.preventDefault();
        var formData = new FormData($(this)[0]);
        $.ajax({
            url: "ajax/acttdb",
            data: formData,
            dataType: "json",
            type: "POST",
            cache: false,
            contentType: false,
            processData: false,
            success: function (data, status, jqXhr)
            {
                //BLAH
            }
        });
    });
});

我注意到你可能还需要解决另外两件事。您希望在加载图标后以某种方式更新图标。您将需要一些其他方法来查找成功函数内部的图标(可能查看返回的数据可能会产生一些有用的信息)。因为它是json，所以应该很容易更新。)

同样，当前的方式将绑定到页面上的所有表单。如果页面上有多个表单，则可能需要更改选择器以使用id。

希望这对你有帮助!

基于增量调用和我的猜测，我不得不说每次进行(ajax)调用时都会打印此代码，导致在每次调用中再次绑定form元素。我说的对吗?

.