HTML中如何使用preventDefault阻止默认行为

浏览器只在 form 元素上触发真正的“提交默认行为”，click 在按钮上根本不会触发页面刷新——所以监听按钮的 click 是无效的。

• 必须监听 form 元素的 submit 事件：form.addEventListener('submit', e => { ... })
• e.preventDefault() 必须放在回调函数第一行，不能包在 setTimeout、fetch().then() 或任何异步逻辑里
• 动态插入的表单要用事件委托，监听父级并判断 e.target.tagName === 'FORM'
• 提交按钮建议显式写成

touchstart 和 touchmove 里用 preventDefault() 要命

iOS Safari 和新版 Chrome 对触摸事件加了 passive 限制：默认情况下 touchstart 是 passive 的，此时调 preventDefault() 不仅无效，还会报 warning。

• 除非你在做手势识别、拖拽滚动等强交互，否则别碰 touchstart 的 preventDefault()
• 想禁用滚动，优先用 CSS：touch-action: none（配合 JS 手势库更稳）
• 真要 JS 拦截，只在明确判定为横向滑动等场景下才调，不要无条件执行
• 若必须监听，加 { passive: false } 参数：el.addEventListener('touchmove', handler, { passive: false })

最容易被忽略的一点：框架里（React/Vue）的合成事件对象不是原生 event，e.preventDefault() 必须显式调用，且不能依赖 e.target 等原生属性——很多失效其实是框架没透出正确 event 实例导致的。

文中关于的知识介绍，希望对你的学习有所帮助！若是受益匪浅，那就动动鼠标收藏这篇《HTML中如何使用preventDefault阻止默认行为》文章吧，也可关注golang学习网公众号了解相关技术文章。