jquery 如何应用event.stopPropagation？

wmtdaxz3 于 2022-12-22 发布在 jQuery

关注(0)|答案(2)|浏览(116)

让我先解释一下问题，我使用的UL结构如下：

<ul onmouseover="smenu_over(this)" onmouseout="smenu_out(this)" class="sub-menu" style="left:0;">
            <li><a href="#">Navigation Item with long text do text wrap</a></li>
            <li><a href="#">Sub nav item</a></li>
            <li><a href="#">Sub nav item</a></li>
            <li style="border-bottom:0;"><a href="#">Sub nav item</a></li>
          </ul>

JS功能

function smenu_over(obj) {
  var a = obj.parentNode.childNodes[0];
  if(a!=null) {
   var top = $(".topnav_icons").length && !$(".logo_t").length ? "-45px" : "-34px"; 
   setBckPosition(a, top);
   a.style.color = "#fff";
  }
 }

我需要在此函数中应用event.stopPropagation，该函数在mouseover事件发生时调用。
请帮我的代码应用event.stopPropagation？

jquery

来源：https://stackoverflow.com/questions/3412113/how-to-apply-event-stoppropagation

2条答案

按热度按时间

ilmyapht1#

你是说这个

$('ul.sub-menu a').mouseenter(function(event){
   event.stopPropagation();

   // your code....
});

赞(0）回复(0）举报 2022-12-22

ubof19bj2#

您可以将当前处理程序从内联状态中删除，如下所示：

<ul class="sub-menu" style="left:0;">

然后可以在jQuery中绑定这些函数，如下所示：

$(function() { //run when DOM is ready
  $("ul.sub-menu").hover(smenu_over, smenu_out);
});

在你的函数中，不要使用obj，而是使用this，它将引用你所悬停的元素，如下所示：

function smenu_over() {
  var a = this.parentNode.childNodes[0];
  if(a!=null) {
    var top = $(".topnav_icons").length && !$(".logo_t").length ? "-45px" : "-34px"; 
    setBckPosition(a, top);
    a.style.color = "#fff";
  }
}

这里的重要区别是.hover()Map到mouseenter和mouseleave事件（* 而不是 * mouseover/mouseout），这些事件在进入/离开子节点时 * 不 * 在父节点上触发，因此无需停止传播，它们已经按照您想要的方式运行。
你可能可以进一步优化，但没有看到你的其他代码，我不想给予你任何坏的建议，这将解决目前的问题，虽然。

赞(0）回复(0）举报 2022-12-22

我来回答

jquery 如何应用event.stopPropagation？

2条答案

相关问题

热门标签

最新问答