隐藏提交按钮需区分语义与行为：type="submit" 隐藏后仍触发表单提交；若要保留提交能力，应改用 type="button" + form.requestsubmit()；若彻底隐藏且不可交互，用 hidden 属性；后端依赖 value 时应改用 type="hidden" 输入框。
隐藏提交按钮本身不难，但关键在于：它是否仍要触发提交行为？如果答案是“要”，那不能真让它失效；如果答案是“不要”，那得先防止它意外提交——很多人卡在这一步，不是 CSS 没写对，而是没理清语义和行为边界。
button type="submit" 隐藏后仍会触发表单提交
用 display: none 或 visibility: hidden 隐藏 <button type="submit"></button>，按钮不可见了，但用户按回车、或 JS 调用 form.submit()、甚至其他可聚焦元素触发 submit 事件，表单照样提交。这不是 bug，是浏览器严格遵守规范的结果。
- 只要
type是submit，且在<form></form>内，它就参与表单的默认提交逻辑 -
display: none不影响表单序列化、不阻止 submit 事件冒泡、也不禁用form.submit() - 常见翻车：JS 绑定
click后忘记event.preventDefault()，结果点击后页面跳转
想隐藏又保留提交能力？用 type="button" + JS 显式调用
真正可控的方式是剥离原生提交语义，改由 JS 主动控制：把按钮设为 type="button"，再手动监听并调用 form.requestSubmit() 或 form.submit()。
-
type="button"从 DOM 层切断所有表单行为：不收集字段、不触发 submit 事件、不重置值 - 推荐用
form.requestSubmit()（而非form.submit()），因为它会触发submit事件、校验required字段、尊重novalidate属性 - 示例：
完全不想用户看到/交互？用 hidden 属性比 display:none 更彻底
如果目标是让按钮对所有人（包括键盘用户、读屏软件）都不可见且不可交互，hidden 属性是唯一符合语义的方案。它不是视觉隐藏，而是 DOM 层级的移除。
-
<button type="submit" hidden>提交</button>—— 这个按钮不会被渲染、无法 Tab 进入、读屏软件完全忽略 - 但它仍保留在 DOM 中，JS 可以通过
btn.hidden = false动态显示，无需操作 CSS - 别混用
hidden和aria-hidden="true"：aria-hidden对键盘焦点无效，反而制造“看不见却能按到”的陷阱
后端依赖按钮 value？别藏 value，改用 type="hidden"
有些老代码靠 <button type="submit" value="save"></button> 的 value 区分操作类型。一旦隐藏这个按钮，后端就收不到该值——这不是按钮的问题，是设计缺陷。
- 正确做法：删掉按钮的 value 依赖，改用
<input type="hidden" name="action" value="save"> -
type="hidden"是专为此设计的语义化控件：不渲染、参与提交、无障碍友好 - 避免用
<input type="text" style="display:none">，它可能被聚焦、被样式意外暴露、语义混乱
最易被忽略的一点：隐藏按钮常伴随条件展示逻辑（比如“登录后显示提交”），这时别只切 CSS 或只切 hidden，必须同步控制它的 disabled 状态和表单校验依赖——否则用户可能点不到、点到了却因字段未填而无反馈。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
