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

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

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

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

    //run your code
});

在单击事件中,可以检查事件目标标记名是什么:

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

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

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

nodeName 属于 event.target 如果您的链接有子元素(例如。 <span> 或 <img>

相反,试着从树上爬起来 事件目标 (最深的元素)到 event.currentTarget (事件处理程序注册的事件)并检查这些元素中是否有任何元素是可单击的:

$("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';
}

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

hard/impossible 判断元素在一般情况下是否可单击。

另一种方法是确保所有可单击的子体调用 event.preventDefault() ,则只需检查div上的单击侦听器 event.defaultPrevented event.stopPropagation() ,正如建议的那样 on another answer calling stopPropagation can lead to subtle bugs .