如何将onclick回调附加到div但不在div内的链接上？

Question

HTML

<div class='item_container'>

[...bunch of links and pictures...]
<a class='item_owner'>John Doe</a>

</div>

的Javascript

/**
    Bind the onclick only if you hover on the item since we got a lot
    of items and several events and plugins to setup on them.
*/
$('.item_container').live('mouseenter', function(e){
  $this = $(this);
  if (!$this.data('isSetup')) {
    $this.click(function(e){
      // do magic
      return false;
    });
     [... a lot of other stuff]
    $this.data({'isSetup': true});
  }
});

当然，当我点击div中的任何地方时，它会执行'do magic'。感谢return false，如果我点击div中的任何链接，它仍会执行'do magic'并且不会更改页面，这是预期的行为。

但是有一个链接可以实际更改页面，即所有者链接。麻烦的是，在我目前的设置下，我阻止它工作。

Answer 1

您需要停止从指向父.item_container的链接传播事件。

将此块添加到代码中：

$('.item_container a.item_owner').live('click', function(e){
 e.stopPropagation();
});