在网页开发中，表单是最常见的交互元素之一。无论是登录、注册还是搜索，几乎都离不开表单提交。jQuery提供的submit()方法专门用于处理表单提交相关逻辑，它既可以给表单绑定submit事件，也可以主动触发表单提交动作。刚接触jQuery的同学常常在这里踩坑，比如绑定了事件却不生效、明明调用了submit()页面却刷新了。这篇文章就把submit()方法的基本用法和常见疑问一次讲清楚。
一、submit方法的基本语法与两种用途
submit()方法有两种截然不同的用途。第一种是给表单元素绑定submit事件的处理函数，语法是$(selector).submit(handler)；第二种是不带任何参数调用，即$(selector).submit()，此时它会主动触发该表单的submit事件，相当于点击了表单的提交按钮。
先看绑定的用法。submit事件是在表单真正提交之前触发的，这给了我们在提交前做处理的机会，最常见的场景就是表单校验：
$("#loginForm").submit(function(event) {
var username = $("#username").val();
if (username === "") {
alert("用户名不能为空");
event.preventDefault(); // 阻止表单默认提交
return;
}
// 校验通过，允许表单正常提交
});再看触发的用法。当表单提交按钮不在<form>标签内部，或者你想通过其他操作来提交表单时，就可以手动调用submit()触发提交：
// 点击某个按钮时，触发表单提交
$("#myButton").on("click", function() {
$("#loginForm").submit(); // 主动触发表单提交
});需要特别注意的是，submit()方法只能用在<form>元素上。如果你把它绑定到按钮、div等其他元素上，事件是不会生效的，因为submit事件本身就是表单元素特有的事件。
二、阻止默认提交的几种写法与区别
submit事件处理函数中最常做的事就是阻止表单的默认提交行为。阻止默认刷新有两种常见写法：调用event.preventDefault()，或者直接return false。很多初学者以为两者完全一样，其实存在细微差别。
在jQuery的事件体系中，return false等价于同时调用event.preventDefault()和event.stopPropagation()，也就是说它不仅阻止默认行为，还会阻止事件冒泡。而preventDefault()只阻止默认行为，不影响事件继续向上传播。如果你的表单嵌套在其他也监听了submit事件的容器中，这个差异就会体现出来。
// 写法一：preventDefault，只阻止默认行为
$("#form1").submit(function(event) {
event.preventDefault();
console.log("表单1提交被拦截，但事件仍会冒泡");
});
// 写法二：return false，阻止默认行为并停止冒泡
$("#form2").submit(function(event) {
console.log("表单2提交被拦截，事件也不再冒泡");
return false;
});还有一种容易被忽略的情况：处理函数内部如果抛出了JS异常，默认行为可能不会被阻止，页面照样会刷新。所以建议把preventDefault()写在处理逻辑的最前面，先拦住默认行为再做后续处理，这样更稳妥。
三、动态表单绑定与常见报错排查
在实际项目中，表单经常是动态生成的，比如通过AJAX加载回来的HTML片段中包含表单。这时如果直接用submit(handler)绑定，你会发现事件根本不生效，因为绑定执行时表单还不存在。正确做法是使用事件委托，把事件绑定到已存在的父元素上：
// 推荐使用 on 做事件委托，绑定到 document 或已存在的父容器
$(document).on("submit", "#dynamicForm", function(event) {
event.preventDefault();
console.log("动态表单提交被拦截");
// 这里可以做 AJAX 提交
$.ajax({
url: "/api/login",
type: "POST",
data: $(this).serialize(), // serialize 可快速收集表单数据
success: function(res) {
console.log("提交成功", res);
}
});
});从jQuery 3.0开始，.submit()这种简写绑定事件的写法已经被标记为废弃（但触发仍然可用），官方推荐统一使用.on("submit", handler)来绑定事件，语义更清晰，也方便后续用.off("submit")解绑。
最后整理几个常见疑问：第一，绑定了事件却没反应，先检查选择器是否选中了<form>元素，可以用console.log($("#form1").length)验证；第二，用submit()触发提交时报错，多半是jQuery对象为空，说明选择器写错了；第三，想提交表单又不想刷新页面，记住必须阻止默认行为，然后用serialize()或serializeArray()收集数据走AJAX提交，这是目前主流的无刷新表单方案。
掌握这几点，jQuery的submit()方法基本就能用得得心应手了。核心记住三件事：它只能用于<form>元素、绑定和触发是两种不同用途、阻止默认行为时留意return false与preventDefault()的区别，日常开发中的大部分场景都能轻松应对。
jQuery submitjQuery表单提交submit方法修改时间：2026-09-04 12:52:28