<button>在form中未声明type属性时默认为submit，会触发表单提交；type="button"可彻底禁用表单行为，仅响应click；非法type值将降级为submit或button；type="reset"仅还原HTML初始值，不响应JS修改。
button在form里不写type就提交，不是bug是规范
所有现代浏览器（Chrome、Firefox、Safari、Edge）都严格按 W3C 规范处理：<button>只要出现在<form>内且没写type属性，就等价于type="submit"。它会立刻收集所有带name的字段、发起请求、刷新页面——哪怕你只写了<button>关闭</button>。
常见翻车现象包括：
- JS 的
onclick或框架的@click执行了，但紧接着页面白屏或跳转 - Network 面板看到一次空
POST/GET，URL 是当前页 - React/Vue 中状态更新被中断，控制台无报错，只丢上下文
type="button"才是唯一真正静默的按钮
type="button" 从 DOM 层面切断表单行为：不触发 submit、不冒泡到 form、不收集字段、不重置值。它只响应 click，完全交由 JS 控制。
必须手动绑定事件，否则点击无反应：
立即学习“前端免费学习笔记（深入）”；
-
onclick="doSomething()"或addEventListener('click', handler) -
form.addEventListener('submit', ...)对它完全无效 - 适合场景：模态框开关（如
palk_ui_newsletter_error_close）、AJAX 触发器（“加载更多”）、表单内辅助操作（“清空搜索”“复制链接”）
非法type值（如type=""、type="primary"）会降级为submit
浏览器只认 submit、reset、button 这三个合法值。其他任何字符串，比如：
type="click"type="primary"-
type=""（空字符串）
都会降级处理：
- 在
<form>内 → 当作type="submit"（意外提交） - 在
<form>外 → 当作type="button"（静默，不报错）
这种降级掩盖语义错误，尤其在 SSR、低代码平台或框架动态渲染时最难排查——比如 React 组件返回未带 type 的 <button>，上线后才暴露。
type="reset"不是“清空”，它只还原HTML初始value
type="reset" 的作用非常窄：它只把 <input value="张三"> 这类控件的 value 或 checked 属性设回 DOM 加载时的原始值（即标签里写的值），不是 JS 设置的值，也不是 defaultValue。
这意味着：
-
input.value = "新值"后点reset，仍回到 “张三” - Vue 的
v-model、React 的useState更新的值，reset完全无视 - 没写
value的<input>，初始为空，reset后就是空字符串 - 它不会触发
change或input事件，依赖这些事件更新 UI 的逻辑收不到通知
真正要阻止表单提交，别靠 JS 拦截——e.preventDefault() 只能拦 click，拦不住后续 submit 流程；漏写、写错位置、JS 加载失败，就立刻翻车。显式写 type="button" 是唯一不依赖 JS 执行成功的方案。
