jQuery UI的自动完成不工作
这是我的JavaScript代码:jQuery UI的自动完成不工作
<script type="text/javascript">
//<![CDATA[
$(document).ready(function() {
$("input#suggestZams").autocomplete({
source: "content/prevadzky/zam/zam_json2.php?letter=all",
minLength: 1,
delay: 0,
select: function(event, ui) {
alert(1);
}
});
});
//]]>
</script>
这是我的HTML:
<input id="suggestZams" class="input" size="10" />
的URL zam_json2.php?letter=all
返回此JSON:
[
{ "id": "31440", "value": "Andrej\u010d\u00e1k, Ing." },
{ "id": "31690", "value": "Alexovi\u010d , Ing." },
{ "id": "31796", "value": "Antoni\u010d , Ing." },
{ "id": "31989", "value": "Antolik , Ing." },
{ "id": "32010", "value": "Ambrozov\u00e1 RNDr., PhD." },
{ "id": "32014", "value": "Aksam\u00edt" },
{ "id": "32024", "value": "Angelovi\u010d" },
{ "id": "32102", "value": "Andrej\u010d\u00e1k" },
{ "id": "32168", "value": "Avukov\u00e1 , Ing." },
{ "id": "32177", "value": "Andr\u00e1\u0161" },
{ "id": "32181", "value": "Andrej\u010d\u00e1kov\u00e1 , Mgr." },
{ "id": "32403", "value": "Arend\u00e1\u0161 , Bc." },
{ "id": "47379", "value": "An\u010fal" },
{ "id": "47399", "value": "Adam\u00edk , Ing." },
{ "id": "50022", "value": "Abo\u0161i" },
{ "id": "50085", "value": "Armer\u00eda Olmedo , Ing." },
{ "id": "53468", "value": "Anto\u0161" },
{ "id": "54837", "value": "Adamec , Ing." },
{ "id": "56659", "value": "Apostolou" },
{ "id": "57820", "value": "Alez\u00e1r" },
{ "id": "58576", "value": "Andrej\u010d\u00e1k , Bc." },
{ "id": "58587", "value": "Aronov\u00e1 , Ing." },
{ "id": "58595", "value": "Abaffy , Bc." },
{ "id": "58607", "value": "Adamec , Bc." },
{ "id": "58643", "value": "Antu\u0161 , Ing." },
{ "id": "62277", "value": "Adam\u010d\u00e1k , Mgr." },
{ "id": "62379", "value": "Andruch" },
{ "id": "63415", "value": "Adamkovi\u010d , Ing." }
]
引用:
自动填充可以定制工作 与各种数据源,由刚 指定源的选项。一种数据 源可以是:
- 与本地数据
- 字符串,指定URL的Array
- 回调
当使用一个字符串,该 自动填充插件期望 字符串指向 将返回JSON数据的URL资源。它可以在 相同的主机上或不同的一个 (必须提供JSONP)。请求 参数“term”被添加到该 URL中。数据本身可以是与上述本地数据 相同的格式。
你在做什么看起来很奇怪。我认为您实际上需要编辑服务器端脚本,以便预期查询字符串变量term
而不是字母和返回字符串数组或{label, value}
对象数组而不是{value,id}。
如果URL content/prevadzky/zam/zam_json2.php?letter=all
是提供单词的一次“完全”列表中,你可以做一些沿着这些路线:
$.getJSON("content/prevadzky/zam/zam_json2.php?letter=all", function(data) {
var datacopy = $.map(data, function(item) {
return {
label: item.value,
value: item.id
};
});
$("input#suggestZams").autocomplete({
source: datacopy,
minLength: 1,
delay: 0,
select: function(event, ui) {
alert(typeof ui);
}
});
});
它的工作原理后,才具有BTU恢复了我的jQuery版本到1.4.2。它不适用于jQuery 1.5.1。 – 2011-03-30 09:01:20
如果您想要从网址获取数据,您必须为源定义一个函数:
source: function(request, response) {
$.ajax({url: "content/prevadzky/zam/zam_json2.php?letter=all",
dataType: "json",
...
});
},
...
编辑:
在它说的文档:source
可以是一个URL。在这种情况下,请尝试将JSON响应更改为在返回的对象中使用'label'
而不是'id'
。
这里的脚本,在jQuery的1.5.1为我工作。
source: function(request, response) {
$.ajax({
url: "...",
dataType: "json",
...
success: function(data) {
# data = json response
}
});
}
检查与萤火虫实际的URL是什么,jQuery是试图访问,可能是内容/ prevadzky/ZAM/zam_json2.php?信=一切?T = ... – Peeter 2011-03-30 07:14:38