单击两者都嵌套 <li> 小号

Question

美好的一天。 我搜索过高低。 一无所获。

我有这个结构：

<ul class='c1'>
  <li>
AAA
    <ul class='c2'>
      <li>
BBB
      </li>
    </ul>
  </li>
</ul>

和jQuery处理程序：

$('.c1>li').bind('dblclick',function() {
    alert('a')
});
$('.c2>li').bind('dblclick',function() {
    alert('b')
});

但是，当我单击C2的li时，我会收到两条消息，而不仅仅是“ b”。 event.stopPropagation（）无法解决问题

谢谢。

Answer 1

您还需要将event作为函数与stopPropagation一起使用：

$('.c2>li').bind('dblclick',function(event) {
   event.stopPropagation() 
   alert('b')
});

工作演示

Answer 2

您可以在声明后返回false

$('.c1>li').bind('dblclick', function() {
    alert('a');
    return false;
});

$('.c2>li').bind('dblclick', function() {
    alert('b');
    return false;
});

Answer 3

您可以使用此代码

$( "ul.c1 li" ).children().dblclick(function(e){
    e.stopPropagation(); 
    alert("a");
})

$( "ul.c2 li" ).children().dblclick(function(e){
    e.stopPropagation();
    alert("b");
})