jquery - jQuery 阻止父级对子级 onclick 事件的操作

Question

单击子元素时，我试图阻止父单击操作

我的 JavaScript 代码：

$(".profile").bind("mouseenter mouseleave click",function(e){
e.stopPropagation();
e.preventDefault();
//if blocks depending of one of three actions
} 

在那个 .profile 元素里面是带有列表的 DIV

<div id="tooltip-content" class="tooltip center" style="display: block;">
        <ul>
            <li id="name">Toms IrForšs </li>
            <li id="main"><a onclick="something()">1</a></li>
            <li id="remove"><a onclick="something()">2</a></li>
            <li id="sendmail"><a onclick="something()">3</a></li>
        </ul>
</div>

但是当调用 something 方法时，也会触发父 click 事件。

Answer 1

尝试这个

 $(".profile").bind("mouseenter mouseleave click",function(e){ 
   if (e.target == this)
   {
      //do your stuff
   }
 });

仅当单击的元素与绑定的元素相同时，才会执行 if 条件内的代码。

并使用on()而不是bind()

Answer 2

我为您创建了小提琴，其概念应该适合您（链接），您的代码几乎没有变化。

你错过的是取消传播 - 使用stopImmediatePropagation方法。

而已！