jQuery表单在自身.on('submit')处理程序内提交引发无限循环问题求解

你的问题核心在于：调用jQuery的$("#testform").submit()时，会再次触发你绑定的submit事件处理函数，从而陷入无限循环。以下是几种可行的解决办法：

方法一：调用表单原生DOM提交方法（推荐） #

直接操作表单的原生DOM元素调用submit()，这个方法不会触发jQuery绑定的submit事件，完美避开循环：

$("#testform").on('submit',function(e) {
    e.preventDefault();
    hostedFields.tokenize(function(err, payload) {
        // 处理错误情况
        // 无错误则继续提交
        $("#nonce").val(payload.nonce);
        // 使用原生DOM提交，绕过jQuery事件监听
        document.getElementById('testform').submit();
    });
});

方法二：用标志位区分提交来源 #

设置布尔变量标记是否为回调触发的提交，避免重复执行阻止逻辑：

let isCallbackSubmit = false;
$("#testform").on('submit',function(e) {
    if (isCallbackSubmit) {
        isCallbackSubmit = false;
        return; // 放行回调触发的提交
    }
    e.preventDefault();
    isCallbackSubmit = true;
    hostedFields.tokenize(function(err, payload) {
        // 处理错误情况
        $("#nonce").val(payload.nonce);
        $("#testform").submit();
    });
});

方法三：临时解绑事件再提交 #

先解绑当前的submit事件处理函数，提交后可按需重新绑定：

$("#testform").on('submit',function submitHandler(e) {
    e.preventDefault();
    hostedFields.tokenize(function(err, payload) {
        // 处理错误情况
        $("#nonce").val(payload.nonce);
        // 解绑当前事件处理函数
        $("#testform").off('submit', submitHandler);
        // 提交表单
        $("#testform").submit();
        // 按需重新绑定事件（如果需要再次监听提交）
        $("#testform").on('submit', submitHandler);
    });
});

优先推荐第一种方法，代码简洁且无需额外状态管理，完全适配你的业务场景。

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