首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >jquery停止子事件触发父事件

jquery停止子事件触发父事件
EN

Stack Overflow用户
提问于 2010-03-03 00:12:13
回答 6查看 192.4K关注 0票数 226

我有一个附加了onclick事件的div。在这个div中有一个带有链接的标记。当我单击链接时,来自div的onclick事件也会被触发。我如何才能禁用它,这样如果链接在div上被单击,onclick就不会触发?

脚本:

代码语言:javascript
复制
$(document).ready(function(){
    $(".header").bind("click", function(){
         $(this).children(".children").toggle();
    });
})

html代码:

代码语言:javascript
复制
<div class="header">
    <a href="link.html">some link</a>
    <ul class="children">
        <li>some list</li>
    </ul>
</div>
EN

回答 6

Stack Overflow用户

回答已采纳

发布于 2010-03-03 00:13:11

执行以下操作:

代码语言:javascript
复制
$(document).ready(function(){
    $(".header").click(function(){
        $(this).children(".children").toggle();
    });
   $(".header a").click(function(e) {
        e.stopPropagation();
   });
});

如果你想要read more on .stopPropagation(), look here

票数 435
EN

Stack Overflow用户

发布于 2016-04-27 06:22:40

或者,您可以使用传递给click事件处理程序的Event Object参数来确定是否单击子对象,而不是使用额外的事件处理程序来防止另一个处理程序。target将是被单击的元素,currentTarget将是.header div:

代码语言:javascript
复制
$(".header").click(function(e){
     //Do nothing if .header was not directly clicked
     if(e.target !== e.currentTarget) return;

     $(this).children(".children").toggle();
});
票数 119
EN

Stack Overflow用户

发布于 2015-07-23 18:34:46

更好的方式是将on()与链接一起使用,如

代码语言:javascript
复制
$(document).ready(function(){
    $(".header").on('click',function(){
        $(this).children(".children").toggle();
    }).on('click','a',function(e) {
        e.stopPropagation();
   });
});
票数 21
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/2364629

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档