停止滑動點擊鏈接時

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()動作滑動菜單了，而瀏覽器加載下一頁。