如何实现回调外声明的变量在回调内修改后在外部正常使用（AJAX表单提交）

原代码逻辑失效的核心原因：jQuery AJAX默认是异步执行的，调用接口后会立刻向下执行后续代码，根本不会等待响应返回。此时my_condition仍为未赋值状态，if判断永远走else分支。同时表单submit事件的返回值，只有在事件同步执行流程结束时才会被浏览器识别，异步回调中的返回值不会被事件系统捕获，无法控制提交流程。

不需要阻塞主线程，也不需要使用已不推荐的async: false同步配置，核心逻辑调整为：

• 第一时间打断浏览器原生表单提交流程，避免页面在等待接口返回时直接跳转
• 所有依赖后端返回结果的逻辑，全部放到AJAX的Promise调用链中执行
• 拿到后端校验结果后，再手动触发对应提交流程

参考实现代码 #

$('#my_form').on('submit', function(e) {
    // 立刻阻止表单默认提交行为，打断原生跳转流程
    e.preventDefault();
    const $form = $(this);
    const submitData = $form.serialize();

    // $.ajax本身返回符合Promise规范的对象，直接链式调用即可
    $.ajax({
        method: 'POST',
        url: '/my_url',
        data: submitData
    }).then(function(backendResult) {
        // 接口返回后拿到明确的判断值
        const my_condition = Boolean(backendResult.my_variable);
        
        if (my_condition) {
            // 满足原生提交条件：临时解绑自定义的submit处理器，避免触发死循环
            // 解绑后调用submit即走浏览器原生的表单提交逻辑
            $form.off('submit').submit();
        } else {
            // 不满足原生提交条件，走其他AJAX提交路由
            return $.ajax({
                method: 'POST',
                url: '/other_submit_route',
                data: submitData
            });
        }
    }).catch(function(error) {
        // 兜底处理接口异常场景
        console.error('表单校验请求异常', error);
    });
});

• 不要在AJAX回调中依赖return值控制表单提交：这类return值只会传递给Promise链式调用的下一个环节，和表单提交逻辑没有关联
• 触发原生提交前必须临时解绑自定义的submit处理器：如果直接调用$form.submit()，会重新进入校验逻辑形成无限循环
• 单页应用场景需额外处理：如果原生提交后没有触发页面跳转，需在提交完成后重新绑定之前解绑的submit处理器，避免后续提交无响应

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