如何让点击事件只在父 DIV 上触发，而不是在子 DIV 上触发？

小编典典

如何让点击事件只在父 DIV 上触发，而不是在子 DIV 上触发？

all

我有一个带有foobarclassed 的 DIV，以及该 DIV 中的一些未分类的 DIV，但我想它们正在继承foobar该类：

$('.foobar').on('click', function() { /*...do stuff...*/ });

我希望它仅在单击 DIV 中的某个位置而不是其子 DIV 时触发。

阅读 76

2022-05-17

共1个答案

小编典典

如果与e.target是相同的元素this，则您没有单击后代。

$('.foobar').on('click', function(e) {

  if (e.target !== this)

    return;



  alert( 'clicked the foobar' );

});


.foobar {

  padding: 20px; background: yellow;

}

span {

  background: blue; color: white; padding: 8px;

}


<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div class='foobar'> .foobar (alert)

  <span>child (no alert)</span>

</div>

2022-05-17