javascript 开发语言 ecmascript 点击事件和事件冒泡

三种点击事件

1，鼠标事件

单机事件 onclick 双击事件 ondblclick 移入事件 onmouseover 移出事件 onmouseou 进入事件 onmouseenter 离开事件 onmouseleave 按下事件 onmousedown 抬起事件 onmouseup

2，键盘事件

按下事件 onkeydown 抬起事件 onkeyup

3、浏览器事件

加载完成事件 onload 滚动事件 onscroll

事件冒泡

事件冒泡 ：当一个元素接收到事件的时候 会把他接收到的事件传给自己的父级，一直到window 。 看个例子：

var div1 = document.getElementById("box1");

var div2 = document.getElementById("box2");

div2.onclick = function(){

alert(1);

};

div1.onclick = function(){

alert(2);

};

如果点击box2 先弹出1，然后会弹出2，这说明点击的时候，不仅box2的事件被触发了，它的父级的点击事件也触发了，这种现象就叫做冒泡。

阻止事件冒泡: event.stopPropagation() (重点)

var div1 = document.getElementById("box1");

var div2 = document.getElementById("box2");

div2.onclick = function(){

alert(1);

event.stopPropagation()

};

div1.onclick = function(){

alert(2);

};

这样就可以阻止事件冒泡，防止事件冒泡带来的影响。

参考阅读

 您阅读本篇文章共花了：