2011-04-03 84 views
10

有人能告诉我为什么我的代码为jquery自动完成不工作?jquery自动完成不工作

这是我的javascript代码。

<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.bgiframe.min.js"></script> 
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.dimensions.js"></script> 
<script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function(){ 
     var data = ["Boston Celtics", "Chicago Bulls", "Miami Heat", "Orlando Magic", "Atlanta Hawks", "Philadelphia Sixers", "New York Knicks", "Indiana Pacers", "Charlotte Bobcats", "Milwaukee Bucks", "Detroit Pistons", "New Jersey Nets", "Toronto Raptors", "Washington Wizards", "Cleveland Cavaliers"]; 
     $("#seed_one").autocomplete({ source: data }); 
    }); 
</script> 

这里是我的html:

<input id="seed_one" type="text" name="seed_one"/><br /> <br /> 

感谢,

兰斯

回答

19

警告:这是一个古老的答案,一个老问题约会回到2011年你应该 建议使用jQuery的较新版本,并检查指导的API参考。

您遇到的问题是,你正在使用的jQuery Autocomplete plugin但你打电话了,你就会叫jQuery UI autocomplete的方式。

如果您使用jQuery UI Autocomplete,代码本身可以正常工作,因为您可以see in this fiddle。如果您使用的自动完成插件,你的号召变为

$("#seed_one").autocomplete(data); 

建议:在jQuery UI的

  1. 使用自动完成,而不是自动完成插件。后者已弃用。
  2. 修复http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.dimensions.js,这不可能在这个时候访问

完整代码jQuery UI的

<html> 
<head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      var data = ["Boston Celtics", "Chicago Bulls", "Miami Heat", "Orlando Magic", "Atlanta Hawks", "Philadelphia Sixers", "New York Knicks", "Indiana Pacers", "Charlotte Bobcats", "Milwaukee Bucks", "Detroit Pistons", "New Jersey Nets", "Toronto Raptors", "Washington Wizards", "Cleveland Cavaliers"]; 
      $("#seed_one").autocomplete({source:data}); 
     }); 
    </script> 
</head> 

<body> 
    <input id="seed_one" type="text" name="seed_one"/> 
</body> 
</html> 

为自动完成插件完整代码:

<html> 
<head> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> 
    <script type="text/javascript" src="http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function(){ 
      var data = ["Boston Celtics", "Chicago Bulls", "Miami Heat", "Orlando Magic", "Atlanta Hawks", "Philadelphia Sixers", "New York Knicks", "Indiana Pacers", "Charlotte Bobcats", "Milwaukee Bucks", "Detroit Pistons", "New Jersey Nets", "Toronto Raptors", "Washington Wizards", "Cleveland Cavaliers"]; 
      $("#seed_one").autocomplete(data); 
     }); 
    </script> 
</head> 

<body> 
    <input id="seed_one" type="text" name="seed_one"/> 
</body> 
</html> 
+0

Hmmmm,它仍然无法工作....现在它变得非常令人沮丧 – Lance 2011-04-03 06:09:33

+0

Edi在FF 4上测试包括完整的代码案例。 – 2011-04-03 06:16:40

+0

非常感谢。我有一种倾向,有些时候心不在焉,所以我可能错过了一些微不足道的东西。 – Lance 2011-04-03 06:19:16

5

尝试改变

$("#seed_one").autocomplete({ source: data }); 

$("#seed_one").autocomplete(data); 
-3
*** 

> for Mvc Artitecture you must delete already imbended 
> @Scripts.Render("~/bundles/Jquery") and 
> @Scripts.Render("~/bundles/Jquaryval") on all .cshtml files at the 
> end and for also views/Shared/_layout.cshtml at the end and put our 
> jaquery suitable files on his suitables .cshtmls files in head...and 
> lets enjoy. put on head..these files 
> 
> <link href="~/Content/jquery-ui-1.10.4.custom.min.css" 
> rel="stylesheet" type="text/css" /> <script 
> src="~/Scripts/jquery-1.10.2.js" type="text/javascript"></script> 
> <script src="~/Scripts/jquery-ui-1.10.4.custom.min.js" 
> type="text/javascript"></script> 

***