今天接到一个移交过来的项目, 发现Bug是有一个click事件会触发两次。
我第一反应:是不是没有阻止冒泡?然而是添加了preventDefault的。
最后通过debug和读完源代码,才发现click监听事件被绑定了两次。
当然正常情况下,没人会傻到给同一个元素添加两次监听事件。但是项目参与的人多了,杂了就很容易出现这种情况。如果你找不到重复添加监听事件的位置,或者不知道应该删除哪个的时候。可以用这个方法。希望能帮到同样掉坑的盆友节约时间。
e.stopImmediatePropagation()
//阻止监听同一事件的其他事件监听器被调用。
这里重现一个类似的bug:原意我们是打算点击P元素,在紫色和红色中切换。结果最后没有反应
示例代码(重现bug)
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>event.stopImmediatePropagation demo</title>
<style>
p {
height: 30px;
width: 150px;
}
p.click {
background<