回车提交失效需确认form内是否有type="submit"控件；button须显式声明type="submit"才可靠；textarea换行需精准拦截keydown；form.submit()绕过onsubmit，应监听submit事件处理。
回车提交失效？先确认 form 里有没有 type="submit" 的控件
浏览器原生回车提交只认 type="submit"，不是所有按钮都算数。如果表单里只有 <button>提交</button> 或 <input type="button">，回车根本不会触发提交——它连“提交按钮”都不被识别。常见误判是以为“能点就等于能回车”，其实 button 默认 type 是 submit（Chrome/Firefox/Safari 都如此），但 IE 早期版本默认为 button，现代开发必须显式写 type="submit" 才可靠。
检查要点：
- 用浏览器开发者工具查看 button 元素的 computed type，别信肉眼所见
- 多个 submit 按钮共存时，回车只激活 DOM 中第一个（按源码顺序），不是 name 或 value 决定的
-
<input type="submit">虽然合法，但不推荐：它不能嵌套内容、样式受限、在 FormData 中会意外带上自己的name/value
textarea 里按回车不换行？只拦截它的 keydown，别动 input
<textarea> 是唯一需要干预 Enter 行为的输入控件。用户期望换行，不是提交。但拦截必须精准：只在 textarea 元素上监听 keydown，判断 e.key === 'Enter' 且 !e.shiftKey && !e.ctrlKey && !e.altKey，然后 e.preventDefault()。切记不要对 <input type="text"> 做同样操作——这会直接破坏回车提交能力。
容易踩的坑：
立即学习“前端免费学习笔记（深入）”；
- 在
form或window上监听 keydown 并全局阻止 Enter，会导致所有输入框都无法提交 - 手动插入换行符时没同步更新
selectionStart/selectionEnd，光标会跳到开头或末尾 - 用 CSS 隐藏 submit 按钮（
display: none）来“禁用”回车——它仍参与 DOM 顺序判定，可能让回车触发一个看不见的按钮
手动调 form.submit() 为什么没走 onsubmit 监听器？
form.submit() 是程序化提交，它绕过整个表单事件流：submit 事件不触发、onsubmit 属性函数不执行、e.preventDefault() 完全无效。你写的验证逻辑、埋点、防重复提交都会漏掉。真正可靠的提交入口只有原生 submit 事件。
所以：
- 别在
input的keydown里写form.submit()来“模拟”回车提交 - 如果真要自定义回车行为（比如搜索框回车发 fetch），应该监听
form的submit事件，然后e.preventDefault()，再自己处理逻辑 - 动态控制默认提交目标，用
form.querySelector('button[type="submit"]')手动聚焦，而不是靠 DOM 顺序赌运气
多个按钮共存时，回车总走错逻辑？靠 DOM 顺序和 type 显式声明
回车永远只找第一个 type="submit"，不管它长什么样、有没有文字、是不是 display: none。如果你有“保存草稿”和“正式提交”两个按钮，又希望回车走“正式提交”，就得确保它在 HTML 中出现在“保存草稿”之前，且两者都显式写了 type="submit"。
危险操作：
- 漏写
type属性，指望浏览器“猜”——<button>保存</button>在 Chrome 是 submit，在旧 IE 是 button，行为分裂 - 用
type="button"按钮绑 onclick 调form.submit()，结果回车又触发了另一个 submit 按钮，造成双提交 - 给 submit 按钮加
name和value，导致 FormData 多出一条键值对（如submit=确定），后端可能误解析
最易被忽略的一点：回车提交时，submit 事件和第一个 submit 按钮的 click 事件是并行触发的，不是先后关系。如果你在按钮 onclick 里做了异步操作（比如弹确认框），而没同步阻止表单提交，页面很可能在用户还没点确认时就刷新了。
