问答详情
源自:3-2 IE中的事件对象

为什么不能阻止冒泡和默认行为

// JavaScript Document
//这是event.js
var eventUtil={
	//添加句柄
	addHandler:function(element,type,handler){
		if(element.addEventListener){
			element.addEventListener(type,handler,false);
			}
		else if(element.attachEvent)
		{
			element.attachEvent('on'+type,handler);
		}
		else{
			element['on'+type]=handler;
			}
		},
		//删除句柄
	removeHandler:function(element,type,handler){
		if(element.removeEventListener){
			element.removeEventListener(type,handler,false);
			}
		else if(element.attachEvent)
		{
			element.detachEvent('on'+type,handler);
		}
		else{
			element['on'+type]=null;
			}
		},
		//获取事件对象
		getEvent:function(event)
		{
			return event?event:window.event;
		},
		//获取事件类型
		getType:function(event)
		{
			return event.type;
		},
		//获取事件节点
		getElement:function(event)
		{
			return event.target.nodeName||event.srcElement;
		},
		//阻止事件的默认行为
		preventDefault:function(event)
		{
			if(event.preventDefault)//判断时方法不加括号
			{
				event.preventDefault();
			}
			else
			{
				event.returnValue=false;
			}
		},
		//阻止冒泡
		stopPropagation:function(event)
		{
			if(event.stopPropagation)
			{
				event.stopPropagation();
			}
			else
			{
				event.cancelBubble=true;
			}
		},
}
//这是script.js
// JavaScript Document
window.onload=function()
{
	var go=document.getElementById('go');
	var box=document.getElementById('box');
	eventUtil.addHandler(box,'click',function()
	{
		alert('我是盒子box!');
	});
	eventUtil.addHander(go,'click',function(e)
	{e=eventUtil.getEvent(e);
	alert(eventUtil.getElement(e));
	eventUtil.preventDefault(e);
	eventUtil.stopPropagation(e);
	});
}
这是HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>事件处理程序</title>
<script src="event.js"></script>
<script src="script.js"></script>
</head>

<body>
<div id="box">
<input type="button" id="btn" value="按钮" onclick="showMes()"/>
<input type="button" id="btn2" value="按钮2" />
<input type="button" id="btn3" value="按钮3" />
<a href="HelloWorld.html" id="go">跳转</a>
</div>
</body>
</html>

为什么不能阻止冒泡和默认行为??求解

提问者:BLre 2016-12-18 22:48

个回答

  • qq_沃德天维森陌拉莫帅yb_0
    2017-03-25 04:15:11

    script.js里的eventUtil.addHander    addHandler少了一个l

  • BLre
    2016-12-19 22:42:48

    http://img.mukewang.com/5857f13c0001041402280223.jpg运行 效果是

    5857f1a10001cc6205000133.jpg

    5857f1a20001295205000166.jpg

    就是不能结束默认行为,还是跳到HelloWorld.html这个界面

  • BLre
    2016-12-19 22:39:05

    http://img.mukewang.com/5857f0d80001714d02080173.jpg这是我dw,index是HTML文件

  • 水墨流沙
    2016-12-19 17:27:35

    script引入的js文件和这个html文件是在一个文件夹里??