js阻止子元素事件_javascript,html5_父元素子元素绑定了相同事件，不同动作。如何让子元素上的事件触发时父元素上的事件失效？？或者不触发？？，javascript,html5 - php...

父元素子元素绑定了相同事件，不同动作。如何让子元素上的事件触发时父元素上的事件失效？？或者不触发？？

看如下代码：

html:

css:

.parent{width:300px;height:300px;position:fixed;top:0px;left:50px;border:1px solid blue;}

.child{width:50px;height:50px;position:absolute;top:0px;left:0px;border:1px solid green;}

js:

var parent=document.getElementsByClassName('parent')[0];

var child=document.getElementsByClassName('child')[0];

parent.addEventListener('click',function(){

console.log('你触发了父元素上的事件！');

},false);

child.addEventListener('click',function(){

console.log('你触发了子元素上的事件！');

},false);

以上代码：一旦点击子元素，则父元素，子元素上的事件都会触发，可我只要子元素触发！

修改后：

js:

var parent=document.getElementsByClassName('parent')[0];

var child=document.getElementsByClassName('child')[0];

registerParent();

registerChild();

function registerParent(){

parent.addEventListener('click',parentEvent,false);

}

function removeParent(){

parent.removeEventListener('click',parentEvent);

}

function parentEvent(){

console.log('你触发了父元素上的事件！');

}

function registerChild(){

child.addEventListener('click',childEvent,false);

}

function removeChild(){

child.removeEventListener('click',childEvent);

}

function childEvent(){

removeParent();

console.log('你触发了子元素上的事件！');

registerParent();

}

// 点击之后还是父元素，子元素都触发了事件，有没有什么办法能够实现我要的效果：点击子元素，父元素上的事件失效，或者不触发？？

相关阅读:

怎样实现React.createClass类似的功能

微信浏览器会不会对公众号跳转过来的链接进行预访问。

c语言结构体数组无法运行？

objective c如何new一个对象？

千万级别的 mysql 评论表如何优化

如何将数据库与visual studio 2008进行关联？

前端框架求推荐

Java：Annotation中如何读取动态配置值？

iOS imageWithData 加载出来的图片为null

用JS如何判断打开网页的是安卓还是ios

Python 包导入错误

python 编码问题，求助各位大神

python保存网页到本地，图片不显示可能是什么原因。

在ajax显示块里再次应用ajax，js报方法未定义

开发手机客户端需要什么语言

jq修改img标签src后，单击获取其大小时，为什么总是获取到上一张图片的大小？

微信浏览器 animationend 事件不响应

如何依赖于配置生成对象

如何优化因 MYSQL 读写频繁，负载过高导致的CPU高占用率？

微信调用扫码接口设置阻止跳转 为什么有的时候还是会默认跳转？