在可单击的类中排除类

Question

i具有以下结构（.holder具有40px填充，因此元素周围有很多空间.classA）：

<div class="holder">
  <a href="/path/to/file.html" class="classA">Hello</div>
</div>

当用户单击.holder时，发生了某些事情，但是如果用户单击元素.classA

，我想停止点击启动。

这是我目前使用的，但是我想说的是何时单击.holder，但不是.classA

$(document).on('click', '.holder', function() {
  modClose();
});

可能吗？

Answer 1

单击.classA时，请停止事件传播：

$('.classA').on('click', function(evt) {
    evt.stopPropagation()
});
$(document).on('click', '.holder', function() {
    modClose();
});

来自有关停止propagation的jQuery文档：

描述：防止事件冒泡DOM树，以防止任何父母接听事件的通知。

Answer 2

另一种方式，尽管相似：

$(document).on('click', '.holder', function(e) {
        if($(e.target).hasClass('classA')) return;
        modClose();
    });

Answer 3

您可以检查目标className

$(document).on('click', '.holder', function (e) {
  if (e.target.className.indexOf('classA') == -1) {
    modClose();
  }
});

Answer 4

您可以检查事件的target：

http://jsfiddle.net/kwcaj/

$(document).on('click', '.holder', function(e) {
  if (e.target != this) { 
    console.log('stop');
    return;
  }       
  console.log('go');
});