jquery 自动完成不工作
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5527661/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
jquery autocomplete not working
提问by Lance
Could someone please tell me why my code for the jquery autocomplete is not working?
有人能告诉我为什么我的 jquery 自动完成代码不起作用吗？
Here is my javascript code.
这是我的 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>
And here is my html:
这是我的 html：
<input id="seed_one" type="text" name="seed_one"/><br /> <br />
Thanks,
谢谢，
Lance
槊
回答by Aleksi Yrttiaho
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.
警告：这是对可追溯到 2011 年的旧问题的旧答案。建议您使用更新的 jQuery 版本并查看 API 参考以获取指导。
The problem you're having is that you are using the jQuery Autocomplete pluginbut you're calling it the way you would call the jQuery UI autocomplete.
您遇到的问题是您使用的是jQuery Autocomplete 插件，但您以调用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
如果您使用 jQuery UI 自动完成功能，那么代码本身就可以正常工作，正如您在这个 fiddle 中看到的那样。如果您使用自动完成插件，则必须将调用更改为
$("#seed_one").autocomplete(data);
Suggestions:
建议：
- Use autocomplete in jQuery UI instead of the autocomplete plugin. The latter is deprecated.
- Fix http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.dimensions.js, this couldn't be access at this time
- 在 jQuery UI 中使用自动完成而不是自动完成插件。后者已弃用。
- 修复http://dev.jquery.com/view/trunk/plugins/autocomplete/lib/jquery.dimensions.js，此时无法访问
Complete code for jQuery UI
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>
回答by Can't Tell
Try changing
尝试改变
$("#seed_one").autocomplete({ source: data });
to
到
$("#seed_one").autocomplete(data);
回答by Hasnain Mehmood
For Mvc architecture you must delete already embedded
对于 Mvc 架构，您必须删除已嵌入的
@Scripts.Render("~/bundles/Jquery") and
@Scripts.Render("~/bundles/Jqueryval")
from all .cshtml files at the end and for also views/Shared/_layout.cshtmlat the end and put our jquery suitable files on his suitables .cshtmls files in head...and let's enjoy. put on head..these files
从最后的所有 .cshtml 文件和最后的所有 .cshtml 文件中提取views/Shared/_layout.cshtml，并将我们的 jquery 合适的文件放在他的合适的 .cshtmls 文件中......让我们享受。放在头上..这些文件
<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>
