Question

我不太确定如何点击显示何时点击父级后的div ...？有意义吗？

以下是一个示例代码段。

$('.item').bind('click', function(e){
var showme = $(this).find(".itemcontrols");
$(showme).toggle();
}); 

$('#add').bind('click', function(e){
alert();
});     

<div class="item ui-state-default">
    <div class="itemcontrols" style="display: block;">
        <div id="add">add</div>
        <div id="full">full</div>
        <div id="del">del</div>
    </div>
</div>

.item{display:none;}

Answer 1

您可以为.itemcontrol的孩子添加.itemcontrols课程。

<div class="item ui-state-default">
  <div class="itemcontrols">
    ...
    <div id="add" class="itemcontrol">add</div>
    ...
  </div>
</div>

使用.stopPropagation()函数停止所有.itemcontrol元素的传播。

$('.itemcontrols .itemcontrol').on('click', function(e) {
  e.stopPropagation();
});

除此之外，我建议您使用.on绑定事件，这是当前推荐的方式。

$('.item').on('click', function(e) {
  $(".itemcontrols", this).toggle();
});

$('.itemcontrols .itemcontrol').on('click', function(evt) {
  evt.stopPropagation();
});

See it live here.

如果单击则单击嵌套div

1 个答案: