我觉得我的代码跟老师的一样啊，可是为什么阻止不了事件冒泡呢？
来源：3-1 DOM中的事件对象
_1斯多葛式的冷静1_
2017-05-10 13:26
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>DOM</title>
</head>
<body>
<div id="box">
<input type="button" value="btn1" id="btn1" onclick="getMassage()">
<input type="button" value="btn2" id="btn2">
<input type="button" value="btn3" id="btn3">
<input type="button" value="btn4" id="btn4">
</div>
<script type="text/javascript">
//1.HTML程序事件处理程序
function getMassage(event){
alert(event.target.nodeName);
event.stopPropagation();//阻止事件冒泡
}
function getBox(){
alert('this is the box !!');
}
// //2.DOM0级事件处理程序
// var btn2=document.getElementById('btn2');
// btn2.onclick=function() {
// alert("hello2!");
// }
// btn2.onclick=null;
// //3.DOM2级事件处理程序
// var btn3=document.getElementById('btn3');
// btn3.addEventListener('click',getMassage,false);
// btn3.removeEventListener('click',getMassage,false);
// //4.IE事件处理程序
// var btn4=document.getElementById('btn4');
// btn4.attachEvent('onclick',getMassage);
//5.跨浏览器处理程序
var eventUtil={
addHandler:function(elment,type,handler){
if(elment.addEventListener){//0级
elment.addEventListener(type,handler,false);
}else if(elment.attachEvent){//IE
elment.attachEvent('on'+type,handler);
}else{
elment['on'+type]=handler;
}
},
removeHandler:function(elment,type,handler){
if (elment.removeEventListener) {
elment.removeEventListener(type,handler,false);
}else if (elment.detachEvent) {
elment.detachEvent('on'+click,handler);
}else{
elment['on'+click]=handler;
}
}
}
eventUtil.addHandler(btn3,'click',getMassage);
eventUtil.addHandler(btn3,'click',getBox);
</script>
</body>
</html>
写回答
关注
1回答
-
- _1斯多葛式的冷静1_
- 2017-05-10 20:36:23
我知道为什么了，加一句var box=document.getElementById('box');再把最后一句 eventUtil.addHandler(btn3,'click',getBox);最后这句中的btn3应该改为box
DOM事件探秘
DOM事件？本课程会通过实例来给小伙伴们讲解如何使用这些事件
99545 学习 · 1197 问题
相似问题