使用本地json文件的jQuery自动完成功能? [英] jQuery autocomplete using a local json file?
本文介绍了使用本地json文件的jQuery自动完成功能?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我正在尝试创建一个使用本地json文件的jQuery自动完成小部件.
I am trying to create a jQuery autocomplete widget that uses a local json file.
我的索引页面的代码如下:-
The code for my index page is as follows:-
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Demo</title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/themes/base/minified/jquery-ui.min.css" type="text/css" />
</head>
<body>
<p>
<label>Address:</label>
<input type='text' name='ward' value='' class='auto'>
</p>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.1/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function() {
//autocomplete
$(".auto").autocomplete({
source: data.json,
minLength: 3,
delay: 0,
});
});
</script>
</body>
</html>
然后我有一个单独的文件，名为data.json，其中包含以下代码:-
I then have a separate file which I have called data.json containing the below code:-
[
{"label":"Aragorn", "actor":"Viggo Mortensen"},
{"label":"Arwen", "actor":"Liv Tyler"},
{"label":"Bilbo Baggins", "actor":"Ian Holm"},
{"label":"Boromir", "actor":"Sean Bean"},
{"label":"Frodo Baggins", "actor":"Elijah Wood"},
{"label":"Gandalf", "actor":"Ian McKellen"},
{"label":"Gimli", "actor":"John Rhys-Davies"},
{"label":"Gollum", "actor":"Andy Serkis"},
{"label":"Legolas", "actor":"Orlando Bloom"},
{"label":"Meriadoc Merry Brandybuck", "actor":"Dominic Monaghan"},
{"label":"Peregrin Pippin Took", "actor":"Billy Boyd"},
{"label":"Samwise Gamgee", "actor":"Sean Astin"}
];
当尝试搜索标签时，什么也没有返回，这是否有明显的错误之处?我查看了官方样本，但他们没有使用已经完整的本地json文件，因此不确定我是否对源代码进行了错误编码?
When trying to search for a label nothing returns, is there something obviously wrong here? I have looked at the official samples but they do not use an already complete local json file so not sure if I am incorrectly coding the source right?
谢谢！
推荐答案
您未设置数据
var data = [
{"label":"Aragorn", "actor":"Viggo Mortensen"},
{"label":"Arwen", "actor":"Liv Tyler"},
{"label":"Bilbo Baggins", "actor":"Ian Holm"},
{"label":"Boromir", "actor":"Sean Bean"},
{"label":"Frodo Baggins", "actor":"Elijah Wood"},
{"label":"Gandalf", "actor":"Ian McKellen"},
{"label":"Gimli", "actor":"John Rhys-Davies"},
{"label":"Gollum", "actor":"Andy Serkis"},
{"label":"Legolas", "actor":"Orlando Bloom"},
{"label":"Meriadoc Merry Brandybuck", "actor":"Dominic Monaghan"},
{"label":"Peregrin Pippin Took", "actor":"Billy Boyd"},
{"label":"Samwise Gamgee", "actor":"Sean Astin"}
];
$(function() {
//autocomplete
$(".auto").autocomplete({
source: data,
minLength: 3,
delay: 0,
});
});
这篇关于使用本地json文件的jQuery自动完成功能?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
