JQuery菜單不能正常工作

我正在嘗試JQuery的菜單小部件，並出於某種原因，它不工作。我已經在我的瀏覽器和JSFiddle（http://jsfiddle.net/evanvee/MANH4/2/）上試過了。JQuery菜單不能正常工作

HTML代碼：

<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>Page Title</title> 
    <link rel="stylesheet" href="template.css"> 
    <link rel="stylesheet" href="includes/jquery/themes/base/jquery.ui.all.css"> 
    <script src="includes/jquery/jquery.ui.core.js"></script> 
    <script src="includes/jquery/jquery-1.9.1.js"></script> 
    <script src="includes/jquery/jquery.ui.widget.js"></script> 
    <script src="includes/jquery/jquery.ui.position.js"></script> 
    <script src="includes/jquery/jquery.ui.menu.js"></script> 

    <script> 
     $(function() { 
      $("#menu").menu(); 
     }); 
    </script> 
    <style> 
     .ui-menu { width: 150px; } 
    </style> 
</head> 
<body> 
<div id="container"> 
    <div id="banner"> 
     <h1>Page Heading</h1> 
    </div> 
    <div id="nav"> 
     <ul id="menu"> 
      <li class="ui-state-disabled"><a href="#">Aberdeen</a></li> 
      <li><a href="#">Ada</a></li> 
      <li><a href="#">Adamsville</a></li> 
      <li><a href="#">Addyston</a></li> 
      <li> 
       <a href="#">Delphi</a> 
       <ul> 
        <li class="ui-state-disabled"><a href="#">Ada</a></li> 
        <li><a href="#">Saarland</a></li> 
        <li><a href="#">Salzburg</a></li> 
       </ul> 
      </li> 
      <li><a href="#">Saarland</a></li> 
      <li> 
       <a href="#">Salzburg</a> 
       <ul> 
        <li> 
         <a href="#">Delphi</a> 
         <ul> 
          <li><a href="#">Ada</a></li> 
          <li><a href="#">Saarland</a></li> 
          <li><a href="#">Salzburg</a></li> 
         </ul> 
        </li> 
        <li> 
         <a href="#">Delphi</a> 
         <ul> 
          <li><a href="#">Ada</a></li> 
          <li><a href="#">Saarland</a></li> 
          <li><a href="#">Salzburg</a></li> 
         </ul> 
        </li> 
        <li><a href="#">Perch</a></li> 
       </ul> 
      </li> 
      <li class="ui-state-disabled"><a href="#">Amesville</a></li> 
     </ul> 
    </div> 
    <div id="content"> 
     <p><h2>Page heading</h2></p> 
     <p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem vel eum iriure dolor in hendrerit in </p> 

    </div> 
    <div id="footer"> 
     Footer stuff here 
    </div> 
</div> 
</body> 
</html>

出於某種原因，子彈都顯示爲菜單項，而不是在本例中的實際菜單。我正確地錯過了相當簡單的事情，但似乎無法弄清楚問題所在。我完全沒有偏離這個例子。另外，我從來沒有遇到過任何JQuery代碼的問題。

任何幫助將不勝感激！

來源

2013-05-05 evanvee

看到它的作品http://jsfiddle.net/VxtdW/你需要包括jQuery和jQuery的UI腳本... – PSL 2013-05-05 23:43:25

檢查您的開發者控制檯的錯誤。同樣在你的小提琴上，你還沒有選擇在左上角加載jQuery。 – 2013-05-05 23:44:36

該頁面的工作原理和jquery包含在左上角 – evanvee 2013-05-05 23:46:06

你沒有包括jQuery和jQuery用戶界面在你的提琴：

$(function() { 
     $("#menu").menu(); 
    });

http://jsfiddle.net/MANH4/7/

還要檢查你的開發者控制檯中的錯誤。

來源

2013-05-05 23:46:19

JQuery菜單不能正常工作

回答

相關問題