jQuery通过AJAX循环提交多表单：外部一键保存按钮失效原因排查

• 核心问题在于你定义的 submitForms 函数功能是为表单绑定submit事件监听，而非直接执行表单提交操作。你在批量提交的点击回调中调用该函数，仅完成了每个表单的提交事件绑定，并未触发实际的提交动作，所以没有请求发出。
• 此前单个表单提交能正常运行，是因为点击表单内按钮时，浏览器默认行为会触发表单的submit事件，刚好你在点击回调中绑定完事件就触发了该事件，绑定的Ajax逻辑才会执行。
• 额外隐患：如果多次点击批量提交按钮，会重复给同一个表单绑定多次相同的submit事件监听器，后续触发提交时会重复发起多次相同的Ajax请求，造成不必要的资源开销。

首先调整事件绑定逻辑，页面初始化时就统一为所有表单绑定提交事件，避免每次触发提交前重复绑定：

// 页面加载完成后统一绑定所有表单的提交逻辑
$('.form').submit(function(e) {
    e.preventDefault();
    let $form = $(this),
        url = $form.attr('action');
    $.ajax({
        type: 'POST',
        url: url,
        data: $form.serialize(),
        success: function(data) {}
    });
});

// 单个表单提交按钮逻辑
$('.form button').click(function(e) {
    e.preventDefault();
    $(this).closest('form').submit();
});

再修改批量提交逻辑，直接触发每个表单的submit事件即可：

$('#save_all').click(function(e) {
    e.preventDefault();
    $('.form').each(function() {
        $(this).submit();
    });
});

内容的提问来源于stack exchange，提问作者Tyssen