jquery滑動菜單

Question

再次。我有一個我正在建立的菜單。一切工作正常，除了當我點擊其中一個主要類別時，頁面跳回頂端。我想阻止這一點，但我擔心使用preventDefault（）會阻止正確加載其他鏈接。

這裏是代碼..

jQuery的

$(document).ready(function() { 
    // Collapse everything but the first menu: 
    $("#nav_menu > li > a").find("+ ul").slideUp(1); 
    // Expand or collapse: 
    $("#nav_menu > li > a").click(function() { 
     $(this).find("+ ul").slideToggle("fast"); 
    }); 
}); 

的標記

<ul id="nav_menu"> 
    <li><a href="#">Main Cat 1</a> 
     <ul> 
      <li><a href="whatever.php">Subcat 1</a></li> 
      <li><a href="whatever.php">Subcat 2</a></li> 
     </ul> 
    </li> 
    <li><a href="#">Main Cat 2</a> 
     <ul> 
      <li><a href="whatever.php">Subcat 1</a></li> 
      <li><a href="whatever.php">Subcat 2</a></li> 
     </ul> 
    </li> 
</ul> 

任何幫助，將不勝感激！ :)

Answer 1

您需要調用preventDefault函數，以便您的a元素不會觸發href。

$(document).ready(function() { 
    // Collapse everything but the first menu: 
    $("#nav_menu > li > a").find("+ ul").slideUp(1); 
    // Expand or collapse: 
    $("#nav_menu > li > a").click(function(e) { 
     e.preventDefault(); 
     $(this).find("+ ul").slideToggle("fast"); 
    }); 
});