Question

我有一个块元素的自定义onclick处理程序（通过jQuery的.click（）方法设置）。此块元素可以包含链接。

我相当确定这是可能的，所以，如果它是我点击的链接（如果访问链接而不运行我的代码），我如何让处理程序简单地返回？

Answer 1

检查事件对象以查看目标是否为锚标记，然后返回true：

$("div").click(function(eventObject){

    if($(eventObject.target).is("a"))
        return true;

    //run your code
});

Answer 2

在点击事件中，您可以查看事件目标标记名是什么：

$("#myDiv").click(function(e) {
  if (e.target.tagName.toLowerCase() == "a") {
    return true; //link clicked
  } else {
    //run your usual div click code here...
  }
});

Answer 3

如何在点击功能中测试元素是否为锚？

if(this.tagName() == "a")return true;

我没有测试，请检查并回复

Answer 4

如果您的链接具有后代元素（例如nodeName或event.target），则检查<span>的{{1}}不起作用。

相反，尝试从<img>（最深的元素）向上走到树event.target（事件处理程序已注册的事件），并检查是否有任何元素可点击：

event.currentTarget

演示：http://jsbin.com/fojaco/2/

请注意，您必须为特定网页自定义isClickable;在一般情况下判断一个元素是否可点击是hard/impossible。

另一种方法是确保所有可点击的后代都调用$("div").click(function(event) { if (clickableBetweenTargetAndCurrentTarget(event)) return; // This click was probably already handled. doSomething(); }); function clickableBetweenTargetAndCurrentTarget(event) { for (var el = event.target; el && el != event.currentTarget; el = el.parentNode) { if (isClickable(el)) return true; } return false; } function isClickable(el) { // TODO: Customize this as appropriate for your webpage. return el.nodeName == 'A' || el.nodeName == 'BUTTON'; }，然后div上的点击侦听器只需要检查event.preventDefault()（IE9 +）。或者后代可以按照建议on another answer拨打event.defaultPrevented，但calling stopPropagation can lead to subtle bugs。

使onclick处理程序忽略链接上的点击

4 个答案: