使用jQuery Validation插件：submitHandler内无法触发默认提交

我明白你遇到的困扰了——在jQuery Validation的submitHandler里完成AJAX验证后，想触发表单的默认提交，但要么陷入无限循环，要么毫无反应。咱们来一步步拆解原因和解决方案：

为什么会出现这种情况？ #

1. $(form).submit()导致循环：jQuery的submit()方法会触发所有绑定在表单上的submit事件，包括jQuery Validation插件的验证逻辑。所以你在submitHandler里调用它，会再次触发验证流程，形成无限循环。
2. form.submit()无反应：你之前的代码用了async: false（同步AJAX），这会阻塞浏览器线程，可能导致后续的form.submit()执行时机出问题；另外，successful变量的赋值逻辑也存在漏洞（比如AJAX请求过程中出现未覆盖的异常场景，导致变量未正确赋值）。

正确的解决方案 #

首先要抛弃同步AJAX（async: false已被现代浏览器废弃，且用户体验极差），改用异步AJAX，然后在请求完成后直接调用原生的表单提交方法（绕过jQuery的事件绑定）：

submitHandler: function(form, event) {
    // 手动阻止默认提交（插件其实已经做了，这里添加更保险）
    event.preventDefault();

    $.ajax({
        url: myurl,
        dataType: "json",
        type: "post",
        contentType: "application/json",
        data: JSON.stringify(mydata)
    }).done(function(response) {
        if (response) {
            // 调用原生submit方法，不会触发jQuery绑定的验证事件
            form.submit();
        } else {
            // 验证失败时的提示，可根据你的需求调整
            alert("数据验证未通过，请检查");
        }
    }).fail(function() {
        // AJAX请求出错时的处理
        alert("请求失败，请稍后重试");
    });
}

关键要点 #

• 用原生form.submit()：原生的提交方法不会触发jQuery绑定的submit事件，因此不会再次触发jQuery Validation的验证流程，能直接执行表单的默认提交行为。
• 异步AJAX更可靠：同步AJAX会阻塞浏览器，导致页面假死，还容易出现时序问题，异步请求是现代前端的标准做法。
• 避免依赖全局变量：之前的successful变量容易出现赋值不及时的问题，直接在AJAX的回调里处理提交逻辑，逻辑更清晰也更可靠。

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