type="button"能阻止表单提交，因为浏览器默认将表单内无type属性的button视为type="submit"，显式声明type="button"即告知浏览器该按钮无默认行为，不触发表单提交。

为什么 type="button" 能阻止表单提交

因为浏览器对 <button></button> 标签有默认行为：在表单内、且 type 未显式声明时，它会被当作 type="submit" 处理。只要没写 type，点击就会触发表单提交——哪怕你只想要一个纯触发 JS 的按钮。

显式写上 type="button" 就是告诉浏览器：“这真不是提交按钮，别管表单”。这是最轻量、最直接的拦截方式，不依赖 JS，也不影响语义。

type="button" 和 type="submit" 的实际差异

两者在 DOM 中都渲染为可点击按钮，但行为完全不同：

• type="submit"：自动触发最近祖先 <form></form> 的 submit 事件，执行表单提交（即使没有 JS 监听）
• type="button"：无任何默认行为，必须靠 JS 绑定 click 才能做事
• 省略 type 属性时，等价于 type="submit"（HTML 规范定义）

容易被忽略的坑：嵌套在 <form></form> 里的 button 不写 type 就翻车

常见错误场景：用 <button onclick="doSomething()">删除</button> 放在表单里，结果点一下整个页面刷新或跳转——其实只是表单默默提交了。

修复方法很简单：

使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件

如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Andr​​oid友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Andr​​oid应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更

下载

删除

注意：type="button" 必须写全，不能缩写成 type=button（虽然部分浏览器容忍，但 HTML5 要求带引号）；也不能写成 type="reset" 或其他值来“凑合”，那会引入新副作用。

要不要加 preventDefault()？多数情况不用

有人习惯给 button 写 onclick="event.preventDefault(); doSomething();"，这是冗余的——type="button" 本身就不触发 submit，默认行为根本不存在，preventDefault 没东西可防。

只有当你用了 type="submit" 又想拦截提交时，才需要 event.preventDefault()。但那就绕远了：不如一开始就用 type="button"。

真正要小心的是：如果按钮同时承担“校验后提交”功能，别误用 type="button" 导致 submit 逻辑彻底失效——这时候该用 type="submit" + JS 校验 + 条件性 preventDefault。

前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！