jquery-ui菜單不能像預期的那樣工作

我想用jquery-ui菜單小部件製作菜單，但它不能正常工作。jquery-ui菜單不能像預期的那樣工作

的代碼是一個基本的例子：

 <script> 
      $(document).ready(function() { 
       $("#menu").menu(); 
      }); 
     </script> 
     <style> 
      .ui-menu 
      { 
       width: 150px; 
      } 
     </style> 

     <ul id="menu"> 
      <li><a href="#">Item 1</a></li> 
      <li><a href="#">Item 2</a></li> 
      <li><a href="#">Item 3</a> 
       <ul> 
        <li><a href="#">Item 3-1</a></li> 
        <li><a href="#">Item 3-2</a></li> 
        <li><a href="#">Item 3-3</a></li> 
        <li><a href="#">Item 3-4</a></li> 
        <li><a href="#">Item 3-5</a></li> 
       </ul> 
      </li> 
      <li><a href="#">Item 4</a></li> 
      <li><a href="#">Item 5</a></li> 
     </ul>

它總是出現這樣的（內部菜單始終可見）：

enter image description here

任何想法？

來源

2013-10-18 jannagy02

[做工精細這裏（http://jsfiddle.net/VPmDG/）。你是否壓倒風格或類似的東西？使用您正在使用的任何開發工具集檢查菜單 – billyonecan

您可以上傳jsFiddle上的這段代碼嗎？這看起來很好，所以我建議你在頁面上有另一個腳本，它們可以覆蓋或觸發'a'標籤上的點擊事件。 – Dvir

查看我給出的答案@ jannagy02 –

你一定可能錯過下面的庫或樣式表之一，否則我沒有看到代碼中的任何錯誤。

<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> 
<script src="http://code.jquery.com/jquery-1.9.1.js"></script> 
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> 
<link rel="stylesheet" href="/resources/demos/style.css" />

這裏是一個工作搗鼓你：http://jsfiddle.net/NrfW8/

來源

2013-10-18 09:11:41

問題出在我的版本上。我使用ASP.NET MVC4模板。它有jquery-1.7.1和jquery-ui-1.8.20 – jannagy02

利用這個jQuery腳本：

<li><a href="#">Item 1</a></li> 
      <li><a href="#">Item 2</a></li> 
      <li id="i3"><a href="#">Item 3</a> 
       <ul id="inner"> 
        <li><a href="#">Item 3-1</a></li> 
        <li><a href="#">Item 3-2</a></li> 
        <li><a href="#">Item 3-3</a></li> 
        <li><a href="#">Item 3-4</a></li> 
        <li><a href="#">Item 3-5</a></li> 
       </ul> 
      </li> 
      <li><a href="#">Item 4</a></li> 
      <li><a href="#">Item 5</a></li> 
     </ul>

結帳我已經爲你做了的jsfiddle：

$(document).ready(function() { 
       $("#menu").menu(); 
       $("#inner").hide(); 
       $("#i3").click(function() { 
       $("#inner").toggle(); }); 

      });

更改HTML代碼後http://jsfiddle.net/8ryps/

來源

2013-10-18 09:03:53

jquery-ui菜單不能像預期的那樣工作

回答

相關問題