问答详情
源自:5-1 编程挑战

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

如题,求教

提问者:qq_风_54 2016-02-28 14:59

个回答

  • 茶叶321123
    2016-03-01 15:38:35
    已采纳

    试了下……不会触发

  • 茶叶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;
    		}
    	},
    }


  • loserliu
    2016-02-28 20:27:00

    好像会触发,因为父元素都触发,那么兄弟元素也就触发了吧