Question

我想在点击div时触发一个事件，但如果我点击该div上的特定链接，我不希望触发该事件：

我的JS

$("#myDiv").not("#myLink").click(function () {
    alert("clicked");
});

//Or

$("#myDiv:not(#myLink)".click(function () {
    alert("clicked");
});

$("body").on('click', '#myLink', function(e) {
    e.stopPropagation();
});

我的HTML

<div id="myDiv">
    <a href="#" id="myLink">Some link</a>
</div>

这是jsfiddle

编辑：实际上我的真实代码是使用“开启”方法，我已经尝试过stopPropagation但是在这种情况下不起作用

Answer 1

为了得到你想要的结果，你必须在anchor元素上注册一个事件处理程序，当执行时阻止事件传播。

$("#myLink").click(function(e) {
    e.stopPropagation();
});

为什么会这样做？

事件传播从根元素开始直到目标元素（捕获阶段）和到达目标后，他们爬回到根元素（冒泡阶段）。目标元素是接收事件的元素。

可以在捕获阶段注册事件侦听器，两者都在冒泡阶段。在这里，我们使用jQuery在冒泡阶段注册事件。

stopPropagation允许阻止通过DOM传播事件。

这是我写的一篇文章，以防您需要有关W3C event model的更多信息。

Answer 2

为了不必重复代码停止执行你在div中放置的每个链接，你可以使用stopPropagation。

$('#myDiv a').click(function(e) {
    e.stopPropagation(); //stops default link action
    //do your stuff
});

这将阻止所有链接（<a>）执行他们通常在#myDiv div内执行的方式。

Answer 3

这可能也有效

$("#myDiv").click(function (ev) {
     alert("clicked");


}).children().click(function(e) {
  return false;
});

http://jsfiddle.net/SjDdN/7/

单击除链接之外的div的Fire事件

3 个答案: