Question

一个jquery问题。

我有一个包含文本和锚标记的div。

我想为div标签及其内容分配一个click事件，排除锚标签。

因此，当我点击div时，会弹出一个警告窗口。但是，如果我单击锚点（在div中），则不应发生警报。

div就是这样的：

<div id="myDiv">
    This is the content of the div.
    <img src="blah.jpg" />
    <a href="somewhere.html">Click here</a>.
    Some more content.
</div>

有什么想法吗？我正在使用jquery将click事件分配给div。

Answer 1

您可以检查点击的目标，因为<a>没有孩子，例如：

$("#myDiv").click(function(e) {
  if(e.target.nodeName == 'A') return;
  //click handler code
});

Answer 2

扩展Nick的答案，以下是我最终使用的内容，因为它占据了嵌套标签。

function handleClick(e) {
    var $current = $(e.target);

    // return if we don't want to override another click event
    // check current tag
    var tags = ['A', 'BUTTON', 'INPUT'];
    if (tags.indexOf(e.target.tagName) >= 0)
      return;
    // check parent tags
    var ignoreClick = false;
    $.each(tags, function(i, tag) {
      console.log('checking tag', tag);
      if ($current.parents(tag).length) {
        ignoreClick = true;
        return;
      }
    });
    if (ignoreClick)
      return;

    // do your normal click stuff here
}

JsFiddle

将click事件分配给div但不在其中锚定

2 个答案: