我正在查看this jQuery Autocomplete example。我需要在這個jQuery Autocomplete示例中更改以使其與我的JSON url一起工作?
我無法弄清楚這個代碼有多少取決於返回的JSON數據的結構。
例如,下面有一行:
name_startsWith: request.term
是name_startsWith
或定義其他地方的功能某種類型的隱函數?
它指的是什麼reqest.term
?我找不到在html文檔中任何其他地方引用的文本term
。
我想嘗試用我自己的JSON url替換爲示例來查看它是否有效,但我不知道基於JSON響應數據的結構需要更改多少示例。
<script>
$(function() {
function log(message) {
$("<div/>").text(message).prependTo("#log");
$("#log").attr("scrollTop", 0);
}
$("#city").autocomplete({
source: function(request, response) {
$.ajax({
url: "http://ws.geonames.org/searchJSON",
dataType: "jsonp",
data: {
featureClass: "P",
style: "full",
maxRows: 12,
name_startsWith: request.term
},
success: function(data) {
response($.map(data.geonames, function(item) {
return {
label: item.name + (item.adminName1 ? ", " + item.adminName1 : "") + ", " + item.countryName,
value: item.name
}
}));
}
});
},
minLength: 2,
select: function(event, ui) {
log(ui.item ?
"Selected: " + ui.item.label :
"Nothing selected, input was " + this.value);
},
open: function() {
$(this).removeClass("ui-corner-all").addClass("ui-corner-top");
},
close: function() {
$(this).removeClass("ui-corner-top").addClass("ui-corner-all");
}
});
});
</script>
</head>
<body>
<div class="demo">
<div class="ui-widget">
<label for="city">Your city: </label>
<input id="city" />
Powered by <a href="http://geonames.org">geonames.org</a>
</div>
<div class="ui-widget" style="margin-top:2em; font-family:Arial">
Result:
<div id="log" style="height: 200px; width: 300px; overflow: auto;" class="ui-widget-content"></div>
</div>
</div><!-- End demo -->