必须在form.on('submit')回调末尾return false以阻止默认跳转，因Layui不自动拦截；仅event.preventDefault()不够稳妥，官方推荐return false兼顾兼容性与完整性。
form.on('submit') 回调里必须 return false
验证失败时页面仍跳转，最常见原因是没在 form.on('submit') 的回调末尾加 return false。layui 的表单提交监听本身不会自动阻止默认行为，它只负责触发回调；是否拦截跳转，完全取决于你这个回调函数的返回值。
注意：不是 event.preventDefault() —— 虽然也能用，但 Layui 官方推荐且更稳妥的方式是直接 return false，它同时等效于 preventDefault() + stopPropagation()，还能兼容老版 IE。
- ✅ 正确写法：
form.on('submit(login)', function(data) { if (!valid) { layer.msg('校验失败'); return false; } /* 后续 AJAX */ }); - ❌ 错误写法：漏掉
return false，或只写event.preventDefault()但没return - ⚠️ 特别注意：如果用了自定义校验（
form.verify），校验不通过时 Layui 会自动弹出提示，但不会自动中断提交流程 —— 你仍需在 submit 回调里手动判断并return false
自定义校验失败后如何主动中断提交
很多人以为只要 form.verify 返回字符串，Layui 就会自动阻止提交。实际上，它只控制「是否显示错误提示」，不控制「是否执行 submit 回调」。也就是说，即使用户名已存在、校验函数返回了 '用户名已存在!'，form.on('submit') 依然会照常执行。
所以必须在 submit 回调里二次检查关键字段，或把校验逻辑挪到 submit 里做同步判断：
- 用同步 AJAX 做唯一性校验（仅限低并发管理后台）：
async: false，拿到code后再决定是否return false - 更推荐异步方式：先禁用提交按钮（
$('button[lay-submit]').prop('disabled', true)），AJAX 校验成功后再提交真实数据；失败则恢复按钮并return false - 避免在
form.verify中依赖异步结果 —— 它设计上就是同步校验入口，强行塞异步会导致不可预测行为
按钮类型和 lay-submit 属性不能少
即使写了 return false，如果表单结构本身不合规，Layui 根本不会绑定 submit 监听，自然也就无法拦截。
确保以下三点全部满足：
-
<form class="layui-form">—— 缺少layui-form类，整个 Form 模块都不会激活 - 提交按钮必须是
<button type="submit" lay-submit>或<input type="submit" lay-submit>——lay-submit是触发form.on('submit()')的开关 - 按钮必须在
<form>标签内部 —— 外部按钮点击不会触发该 form 的 submit 事件
为什么加了 return false 还刷新？检查这些隐藏点
有时候明明写了 return false，页面还是跳转或刷新，问题往往不在表单本身，而在周边逻辑：
- AJAX 成功回调里写了
window.location.href = 'xxx'，但前面忘了加return false—— 提交回调已结束，跳转照常发生 - 表单有多个 submit 监听器（比如全局监听 + 局部监听），其中一个没
return false，就会穿透执行 - 使用了
layer.open弹窗里的表单，但没在弹窗关闭前清理监听，导致父页面的 submit 监听被意外触发 - 浏览器插件（如某些密码填充工具）会模拟点击 submit 按钮，绕过 JS 监听 —— 这种情况只能靠服务端兜底或加防重复提交标识
复杂点在于：Layui 的表单拦截本质是“监听 + 主动终止”，它不改写原生表单行为，也不劫持所有跳转。这意味着任何脱离 form.on('submit') 路径的跳转（比如按钮绑了 onclick="location.href=..."），都得单独处理。最容易被忽略的是——你以为校验失败就万事大吉，其实 submit 回调根本没被拦住。
