jquery語法錯誤

好的，我很簡單地試圖採取這個例子... http://jsfiddle.net/shanabus/HGF59/並把它放在我自己的服務器上的測試頁面上玩。我有另一個jquery的代碼，可以在另一個頁面上正常工作，我在這裏丟失了一些非常明顯的東西嗎？jquery語法錯誤

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8"> 
    <title>jQuery demo</title> 
    <link rel="stylesheet" href="http://code.jquery.com/ui/1.8.18/themes/base/jquery-ui.css" type="text/css" media="all" /> 
    <link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" /> 
<script type="text/javascript" src="jquery-1.7.1.js"></script> 
<script type="text/javascript"> 
    $(function() { 
    var areas = [{ 
     value: "area1", 
     label: "Area 1", 
     desc: "Area 1 extended description"}, 
    { 
     value: "sample2", 
     label: "Sample 2", 
     desc: "Sample of the second area"}, 
    { 
     value: "third-area", 
     label: "Third Area", 
     desc: "This is the third area"}]; 

    var projects = [{ 
     value: "jquery", 
     label: "jQuery", 
     desc: "the write less, do more, JavaScript library", 
     id: 1 
    }, { 
     value: "jquery-ui", 
     label: "jQuery UI", 
     desc: "the official user interface library for jQuery", 
     id: 2 
    }, { 
     value: "sizzlejs", 
     label: "Sizzle JS", 
     desc: "a pure-JavaScript CSS selector engine", 
     id: 3 
    }]; 

    $("#areas").autocomplete({ 
     minLength: 0, 
     source: areas, 
     select: function(event, ui) { 
      $("#areas").val(ui.item.label); 
      $("#project-div").show(); 
      return false; 
     } 
    }).data("autocomplete")._renderItem = function(ul, item) { 
     return $("<li></li>").data("item.autocomplete", item).append("<a>" + item.label + "<br>" + item.desc + "</a>").appendTo(ul); 
    }; 

    $("#project").autocomplete({ 
     minLength: 0, 
     source: projects, 
     focus: function(event, ui) { 
      $("#project").val(ui.item.label); 
      return false; 
     }, 
     select: function(event, ui) { 
      $("#project").val(ui.item.label); 
      $("#project-id").val(ui.item.id); 
      $("#project-description").html(ui.item.desc); 
      alert("I could submit form with id " + ui.item.id); 
      return false; 
     } 
    }).data("autocomplete")._renderItem = function(ul, item) { 
     return $("<li></li>").data("item.autocomplete", item).append("<a>" + item.label + "<br>" + item.desc + "</a>").appendTo(ul); 
    }; 
}); 


    </script> 


</head> 

<body> 



<div class="demo">  
    <label>Choose area:</label>  
    <input id="areas" /> 
    <br /> 
     <div id="project-div" style="display: none;"> 
    <label>Choose project:</label> 
    <input id="project" />  
    <input type="hidden" id="project-id" />  
    <p id="project-description"></p> 
     </div> 
</div> 
</body> 
</html>

該頁面名爲test.html，它位於與jquery-1.7.1.js相同的文件夾中。謝謝！

來源

2012-03-22 Steve Whitlow

你能告訴我們問題究竟是什麼嗎？ – Archer 2012-03-22 13:55:11

控制檯不顯示任何語法錯誤，那麼實際的問題是什麼？無論如何，這段代碼應該做什麼？需要更多信息。 – 2012-03-22 13:55:40

http://jsfiddle.net/HGF59/1/工作正常。 – Blazemonger 2012-03-22 13:55:52

上面的代碼包含jQuery-UI樣式表的鏈接，但不包括jQuery-UI JavaScript的鏈接。（當你在它，爲什麼不鏈接到谷歌代碼版本呢？其他人都一樣。）

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <!-- this goes first --> 
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script> <!-- this goes next -->

來源

2012-03-22 13:56:49 Blazemonger

這工作，但爲什麼沒有這個參考工作？它包含在同一個目錄中嗎？謝謝！ – 2012-03-22 15:12:39

問題不在於你如何鏈接到jQuery;問題在於你之後沒有鏈接到jQuery-UI。他們是兩個單獨的文件。 – Blazemonger 2012-03-22 17:37:38

似乎一切都OK了這裏.. 確保您的jQuery UI的腳本包括在內，是下jQuery.js

來源

2012-03-22 13:58:05

我在標題中使用了，它正確地指向了我駐留在同一文件夾中的版本。 – 2012-03-22 15:10:46

包含jQuery UI嗎？ – 2012-03-23 10:04:43

jquery語法錯誤

回答

相關問題