事件冒泡会触发父元素的兄弟元素吗？-慕课网

首页课程实战体系课手记专栏慕课教程

事件冒泡会触发父元素的兄弟元素吗？

来源：5-1 编程挑战

qq_风_54

2016-02-28 14:59

如题，求教

写回答关注

3回答

茶叶321123

2016-03-01 15:38:35

已采纳

试了下……不会触发

1 0

qq_风_5...

非常感谢！

2016-03-01 21:57:00

共 1 条回复 >

茶叶321123: 2016-03-01 15:40:18

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>事件流</title>
<script src="event.js"></script>
</head>
<body>
<div id="box">
<input type="button" value="按钮" id="btn">
<input type="button" value="按钮2" id="btn2">
<input type="button" value="按钮3" id="btn3">
<a href="event.html" id="go">跳转</a>
</div>
<div id="box2"></div>
<script>
window.onload=function(){
var go = document.getElementById("go");
var box = document.getElementById("box");
var box2 = document.getElementById("box2");

function showboxMes(){
alert("this is box")
}
function showboxMes2(){
alert("this is box2")
}
function showMes(e){
e = eventUtil.getEvent(e);
alert(eventUtil.getElement(e).nodeName);
}

eventUtil.addHandler(box,'click',showboxMes);
eventUtil.addHandler(box2,'click',showboxMes2);
eventUtil.addHandler(go,'click',showMes);
}
</script>
</body>
</html>

var eventUtil = {
	//add事件
	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;
		}
	},
	//delete事件
	removeHandler:function(element,type,handler) {
		if (element.removeEventListener) {
			element.removeEventListener(type,handler,false);
		}else if(element.detachEvent){
			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 || 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;
		}
	},
}

1 0

qq_风_5...

我自己也测试了下，是不会触发

2016-03-01 21:57:45

共 1 条回复 >