如果有 2 个元素可点击，如何强制浏览器仅处理顶部链接？

发布于 2024-08-23 01:36:49 字数 229 浏览 4 评论 0原文

假设我有以下代码：

<div onclick='location.href="http://www.example.com/"'>
  <a href='#' onclick='alert("blah")'>click</a>
</div>

有没有办法只在单击“click”文本时评估锚点，而不评估 div 的 onclick？

原文

Say I have the following code:

<div onclick='location.href="http://www.example.com/"'>
  <a href='#' onclick='alert("blah")'>click</a>
</div>

Is there a way to only have the anchor evaluated when I click the 'click' text and not have the div's onclick evaluated?

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

埋情葬爱 2024-08-30 01:36:49

您可以通过从锚点的单击事件处理程序返回 false 来停止事件传播。

<div onclick='location.href="http://www.example.com/"'>
  <a href='#' onclick='alert("blah"); return false;'>click</a>
</div>

您已经用 jQuery 标记了这个问题。在这种情况下，您应该使用不显眼的 Javascript，因此：

<div id="someid">
  <a href="#">click</a>
</div>

with:

$(function() {
  $("#someid").click(function() {
    window.location.href = "http://www.example.com";
  });
  $("#someid a").click(function() {
    alert("blah");
    return false;
  });
});

是一个更干净的解决方案。

You can stop event propagation by returning false from the anchor's click event handler.

<div onclick='location.href="http://www.example.com/"'>
  <a href='#' onclick='alert("blah"); return false;'>click</a>
</div>

You've tagged this question with jQuery. In that case, you should be using unobtrusive Javascript so:

<div id="someid">
  <a href="#">click</a>
</div>

with:

$(function() {
  $("#someid").click(function() {
    window.location.href = "http://www.example.com";
  });
  $("#someid a").click(function() {
    alert("blah");
    return false;
  });
});

is a much cleaner solution.

回复收藏 0 原文

别把无礼当个性 2024-08-30 01:36:49

请参阅http://www.quirksmode.org/js/events_order.html。

<div onclick='location.href="http://www.example.com/"'>
  <a href='#' onclick='alert("blah"); event.cancelBubble = true; if (event.stopPropagation) event.stopPropagation(); return false;'>click</a>
</div>

event.cancelBubble 用于IE
event.stopPropagation() 是W3C
return false 是取消href 链接。

See http://www.quirksmode.org/js/events_order.html.

<div onclick='location.href="http://www.example.com/"'>
  <a href='#' onclick='alert("blah"); event.cancelBubble = true; if (event.stopPropagation) event.stopPropagation(); return false;'>click</a>
</div>