You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

jQuery/Ajax表单自动提交,添加event.preventDefault仍无法阻止

问题原因分析

你添加的event.preventDefault()只能阻止浏览器默认的表单提交行为(即刷新页面式的提交),但你使用的Ajax.BeginForm依赖ASP.NET的jquery.unobtrusive-ajax.js库——这个库会给表单绑定独立的submit事件处理逻辑,它是通过JavaScript发起Ajax请求完成提交,不属于浏览器默认提交行为,因此你的preventDefault()无法拦截这个Ajax提交流程。

另外可以先排查控制台是否打印了In $('#NewRequest').submit() - newrequest.js:

  • 如果没打印,说明你的submit事件绑定在jquery.unobtrusive-ajax.js之后加载,或者存在事件覆盖的情况;
  • 如果打印了,那就是上述的preventDefault()不影响Ajax请求发起的问题。
解决方法

方案1:利用AjaxOptions的OnBegin回调(推荐,符合Ajax.BeginForm设计)

修改AjaxOptions中指定的OnBegin函数,在里面添加条件判断,返回false即可终止Ajax提交:

function OnBegin() {
    // 替换成你的实际条件判断逻辑
    var isConfirmed = confirm("确定要提交请求吗?");
    // 返回false终止提交,返回true继续执行提交流程
    return isConfirmed;
}

方案2:阻止事件冒泡,完全接管提交逻辑

在你的submit事件处理中添加event.stopImmediatePropagation(),阻止后续绑定的submit事件(包括jquery.unobtrusive-ajax.js的逻辑)执行,之后手动控制提交:

$('#NewRequest').submit(function (event) {
    console.log("In $('#NewRequest').submit() - newrequest.js");
    event.preventDefault(); // 阻止浏览器默认提交
    event.stopImmediatePropagation(); // 拦截其他submit事件处理
    
    // 你的条件判断逻辑
    if (/* 满足提交条件 */) {
        // 解绑当前submit事件后再提交,避免循环触发
        $(this).unbind('submit').submit();
        // 也可以直接用$.ajax编写自定义提交逻辑
    }
});

方案3:给按钮绑定click事件,拦截默认触发

直接给提交按钮绑定click事件,阻止它触发表单提交,再手动控制提交时机:

$('#btnUpdateRequest').on('click', function(event) {
    event.preventDefault(); // 阻止按钮默认的submit触发
    event.stopPropagation();
    
    // 你的条件判断逻辑
    if (/* 满足提交条件 */) {
        $('#NewRequest').submit();
    }
});

额外注意:确保你的newrequest.js是在jquery.js和jquery.unobtrusive-ajax.js之后加载,保证事件绑定的优先级。

内容的提问来源于stack exchange,提问作者Tom

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.30 17:17:53