浏览器对表单内未声明type的默认按type="submit"处理，会触发表单提交；合法type值仅submit、reset、button，其他值均降级为submit，故必须显式声明type="button"以避免意外提交。
在 <form></form> 内部未写 type 的 <button></button>，浏览器一律按 type="submit" 处理——不是 bug，是 W3C 规范强制行为，点一下就会发请求、刷新页面。
为什么没写 type 就会提交表单
所有现代浏览器（Chrome、Firefox、Safari、Edge）对 <button></button> 的默认 type 值有明确约定：只要它出现在 <form></form> 标签内且未声明 type，就等价于 type="submit"。这个行为和 JS 是否加载、是否绑了 onclick 无关。
常见错误现象包括：
- Network 面板看到一次空
POST或GET请求，URL 是当前页 - React/Vue 中状态刚更新完，页面就刷新，控制台无报错但上下文丢失
-
<button onclick="alert('hi')">点我</button>弹窗后立刻白屏
type="button" 才是真正静默的按钮
type="button" 从 DOM 层面切断表单生命周期：不触发 submit 事件、不冒泡到 <form></form>、不收集字段、不重置值，只响应你手动绑定的 click。
而用 type="submit" + e.preventDefault() 拦截，只是阻止了 click，后续的 submit 流程仍会执行——除非你在 <form></form> 上监听 submit 并调用 e.preventDefault()，但这容易漏写或失效。
适用场景举例：
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 模态框关闭按钮（如
palk_ui_newsletter_error_close） - AJAX 触发器（“加载更多”“复制链接”）
- 表单内辅助操作（“清空搜索”“展开详情”）
非法 type 值（如 type="" 或 type="primary"）会降级为 submit
浏览器只认三个合法值：submit、reset、button。其他任何字符串，比如 type="click"、type="primary"、甚至空字符串 type=""，都会被降级处理：
- 在
<form></form>内 → 当作type="submit"（意外提交） - 在
<form></form>外 → 当作type="button"（静默，不报错）
这种降级特别危险，尤其在 SSR、低代码平台或框架动态渲染时——比如 React 组件返回未带 type 的 <button></button>，本地开发正常，上线后才暴露问题。
React/Vue 中也必须显式写 type="button"
框架不会帮你补 type 属性。JSX 中写 <button onclick="{handleClick}">点我</button>，最终渲染出的 DOM 仍是 type="submit"（如果它在 <form></form> 内）。Vue 模板同理。
检查方法很简单：打开 DevTools，选中按钮元素，看 Attributes 里有没有 type；没有就等于 submit。
最容易被忽略的是「按钮是否在 <form></form> 标签内部」——哪怕只是祖辈级嵌套（比如父组件里包了个 <form></form>），也会继承默认行为。别依赖 JS 拦截兜底，语义先行才是稳定解法。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
