停止滑动点击链接时

Question

因此，当您单击父项以显示子元素并且您单击子元素时，它会向下滑动垂直菜单，它会将您带到链接。

我的问题是，当你点击链接时，整个子菜单因为slideToggle功能而滑动 - 只有单击链接时，我怎么能阻止滑动发生？

我的菜单：

<ul id="menu-top" class="menu"> 
    <li class="has-submenu"> 
     <a href="http://mywebsite.com/portfolio/">Portfolio</a> 
     <ul class="sub-menu" style="display: none;"> 
      <li class="menu-item"> 
       <a href="http://mywebsite.com/book-i/">Book I</a> 
      </li> 
     </ul> 
    </li> 
    <li class="has-submenu"> 
     <a href="http://mywebsite.com/retouching/">Headshots</a> 
     <ul class="sub-menu" style="display: none;"> 
      <li class="menu-item"> 
       <a href="http://mywebsite.com/men/">Men</a> 
      </li> 
     </ul> 
    </li> 
    <li class="regular-link"> 
     <a href="http://mywebsite.com/personal-work/">Personal Work</a> 
    </li> 
</ul> 

JS：

jQuery('#menu-top').children().click(function(e){ 
    var $next = jQuery(this).find('.sub-menu'); 
    var $child =('.active-menu'); 
    $next.stop().slideToggle('slow').toggleClass('active-menu'); 
    jQuery(".sub-menu").not($next, $child).slideUp('slow').removeClass('active-menu'); 

}); 
jQuery('.has-submenu > a').click(function(e){ 
e.preventDefault(); 
}); 

Answer 1

使用stopPropagation以防止事件冒泡。

jQuery('.submenu a').click(function(e){ 

    e.stopPropagation(); 

}); 

Answer 2

要向上滑动点击UL的孩子链接时，你可以使用jQuery函数stopPropogation()链接本身的单击事件停止的slideToggle菜单。

$(".shop-by-dept ul li a").click(function(e){ 
    e.stopPropagation(); 
}); 

这将防止slideToggle()动作滑动菜单了，而浏览器加载下一页。