jQuery的自动完成不工作 [英] jquery autocomplete not working

问题描述

可能有人请告诉我为什么我的code为jQuery的自动完成不工作？

下面是我的javascript code。

 ＆LT;脚本SRC =HTTP：//$c$c.jquery.com/jquery-latest.js＆GT;＆LT; / SCRIPT＆GT;
＆LT;脚本类型=文/ JavaScript的 src=\"http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.bgiframe.min.js\"></script>
＆LT;脚本类型=文/ JavaScript的 src=\"http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.dimensions.js\"></script>
＆LT;脚本类型=文/ JavaScript的 src=\"http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.js\"></script>
＆LT;脚本类型=文/ JavaScript的＆GT;
    $（文件）。就绪（函数（）{
        VAR数据= [波士顿凯尔特人，芝加哥公牛，热火，魔术，亚特兰大老鹰队，费城七六人，纽约尼克斯，步行者，山猫 密尔沃基雄鹿，底特律活塞，新泽西篮网，猛龙，奇才，骑士];
        $（＃seed_one）自动完成（{来源：资料}）;
    }）;
＆LT; / SCRIPT＆GT;
 

和这里是我的html：

 ＆LT;输入ID =seed_one类型=文本名称=seed_one/＆GT;＆LT; BR /＆GT; ＆LT; BR /＆GT;
 

谢谢，

兰斯

解决方案

  

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

您遇到的问题是，你正在使用的 jQuery的自动完成插件但你'重新调用它，你会调用 jQuery用户界面自动完成的方式。

如果你使用jQuery UI的自动完成，在code本身工作正常，你可以见。如果您使用的自动完成插件，你已经改变调用

  $（＃seed_one）自动完成（数据）。
 

建议：

1. 在jQuery的用户界面，而不是自动完成插件使用自动完成。后者是德precated。


2. http://dev.jquery.com /view/trunk/plugins/autocomplete/lib/jquery.dimensions.js ，这不可能在这个时候访问

完成code为jQuery用户界面

 ＆LT; HTML和GT;
＆LT; HEAD＆GT;
    ＆LT;脚本类型=文/ JavaScript的SRC =HTTP：//$c$c.jquery.com/jquery-latest.js＆GT;＆LT; / SCRIPT＆GT;
    ＆LT;脚本类型=文/ JavaScript的SRC =htt​​p://ajax.googleapis.com/ajax/libs/jqueryui/1.8.9/jquery-ui.js＆GT;＆LT; / SCRIPT＆GT;
    ＆LT;脚本类型=文/ JavaScript的＆GT;
        $（文件）。就绪（函数（）{
            VAR数据= [波士顿凯尔特人，芝加哥公牛，热火，魔术，亚特兰大老鹰队，费城七六人，纽约尼克斯，步行者，山猫 密尔沃基雄鹿，底特律活塞，新泽西篮网，猛龙，奇才，骑士];
            $（＃seed_one）自动完成（{来源：资料}）;
        }）;
    ＆LT; / SCRIPT＆GT;
＆LT; /头＆GT;＆LT;身体GT;
    ＆LT;输入ID =seed_one类型=文本名称=seed_one/＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
 

完成code为自动完成插件：

 ＆LT; HTML和GT;
＆LT; HEAD＆GT;
    ＆LT;脚本类型=文/ JavaScript的SRC =HTTP：//$c$c.jquery.com/jquery-latest.js＆GT;＆LT; / SCRIPT＆GT;
    ＆LT;脚本类型=文/ JavaScript的 src=\"http://dev.jquery.com/view/trunk/plugins/autocomplete/jquery.autocomplete.js\"></script>
    ＆LT;脚本类型=文/ JavaScript的＆GT;
        $（文件）。就绪（函数（）{
            VAR数据= [波士顿凯尔特人，芝加哥公牛，热火，魔术，亚特兰大老鹰队，费城七六人，纽约尼克斯，步行者，山猫 密尔沃基雄鹿，底特律活塞，新泽西篮网，猛龙，奇才，骑士];
            $（＃seed_one）自动完成（数据）。
        }）;
    ＆LT; / SCRIPT＆GT;
＆LT; /头＆GT;＆LT;身体GT;
    ＆LT;输入ID =seed_one类型=文本名称=seed_one/＆GT;
＆LT; /身体GT;
＆LT; / HTML＆GT;
 

Could someone please tell me why my code for the jquery autocomplete is not working?

Here is my javascript code.

<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>

And here is my html:

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

Thanks,

Lance

解决方案

Warning: This is an old answer to an old question dating back to 2011. You should be advised to use a more recent release of jQuery and check the API reference for guidance.

The problem you're having is that you are using the jQuery Autocomplete plugin but you're calling it the way you would call the jQuery UI autocomplete.

If you'd use the jQuery UI Autocomplete, the code itself works fine as you can see in this fiddle. If you use the the autocomplete plugin, you've to change the call to

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

Suggestions:

1. Use autocomplete in jQuery UI instead of the autocomplete plugin. The latter is deprecated.
2. Fix http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.dimensions.js , this couldn't be access at this time

Complete code for 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>

Complete code for Autocomplete plugin:

<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>

这篇关于jQuery的自动完成不工作的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！