最近进行项目上线优化,遇到很多a标签当按钮使用的场景,每当点击这些“按钮“进行操作时,总会调到页面顶部,印象中可以使用return false来解决,但加到onclick属性的js函数里并没有效果,必须放在js函数后面才可以,今天无意中看到了,原来是js里的坑。截图如下,点击查看出处。
那么如何正确地阻止a标签的默认行为呢?
一般而言,有几种方案:
- href属性设置为 javascript:void(0); 或 javascript:;
- onclick的绑定事件return false
- 使用DOM事件的event.preventDefault()方法
- 如果使用jQuery绑定,使用return false后,库会执行event.preventDefault()、event.stopPropagation()
具体的优劣可以查看参考阅读2。
参考