6

我想在单击 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

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

4

3 回答 3

7

为了获得您想要的结果，您必须在锚元素上注册一个事件处理程序，该处理程序在执行时会阻止事件传播。

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

为什么这个工作？

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

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

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

那是我写的一篇文章，以防您需要有关W3C 事件模型的更多信息。

于 2013-04-14T16:21:35.467 回答
4

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

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

<a>如果它们在#myDivdiv 中，这将阻止所有链接 ( ) 执行它们通常执行的方式。

于 2013-04-14T16:25:25.137 回答
0

这也可能有效

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


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

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

于 2013-04-14T16:26:32.780 回答