我们可以检测一个链接是否在一个有jQuery.click(）的DIV中被点击了吗

Can we detect whether a link was clicked within a DIV that has a jQuery.click()?

本文关键字：一个 DIV click 检测 链接 是否 我们 jQuery      更新时间：2023-09-26

我想知道是否有一种简单的方法可以检测我想要处理点击的div中出现的链接上的点击。。。

因此，有一个简单的HTML代码示例：

<div class="checkmark">
    <div class="box">&nbsp;</div>
    <div class="label">Checkbox label possibly <a href="/random" target="_blank">with an anchor</a>.</div>
</div>

因此，在本例中，我使用一组<div>标记来创建一个复选标记。"框"是我显示一个小正方形的地方，选中时还显示复选标记（例如红十字）

为了使复选标记按预期工作，我使用jQuery并捕获鼠标在主<div>标签上的点击：

jQuery("checkmark").click(function(e){
    e.stopPropagation();
    e.preventDefault();
    jQuery("box", this).toggle("checked");
});

这很简单，效果很好（"checked"类足以显示复选标记，因为它可以使用CSS定义。）

然而，正如我们在示例中看到的，"标签"包括一个锚点。如果我点击锚点，我刚才展示的jQuery就会运行，但锚点什么也不做。如果我删除stopPropagation（）和preventDefault（），锚就会被点击，但复选标记也会被切换。

我想知道的是：有没有一种简单的方法可以检查传播是否会触发锚，在这种情况下，只需忽略"复选标记"代码中的点击？

类似的东西：

jQuery("checkmark").click(function(e){
    if(!(anchor.clicked()))  // how do we do this?
    {
        e.stopPropagation();
        e.preventDefault();
        jQuery("box", this).toggle("checked");
    }
});

附言：我不知道标签上是否有锚。因此，必须在click（）函数中进行发现（除非有更好的设置，并且"if"可能会以不同的方式发生）。

注意：这里我显示了一个target="blank"参数。在真正的交易中，我实际上会打开一个弹出窗口，但这在这里并没有什么区别。

这就是event.target的作用。

例如，在这种情况下：

if($(e.target).is("a")) { 
   // It was the anchor element that was clicked
}

jsFiddle此处

您只需添加以下处理程序：

jQuery("checkmark a").click(function(e){
  e.stopPropagation();
}

它将阻止点击事件从链接冒泡到div，因此链接将被激活，并且事件永远不会到达它将被停止的div。

您可以使用event-deleteTarget属性来查看触发该事件的DOM元素。

if($(e.delegateTarget).is("a"))
    // execute code
相关文章：