javascript - 远程数据源在 Jquery Mobile 自动完成中如何工作？

Question

我正在阅读此页http://demos.jquerymobile.com/1.4.5/listview-autocomplete-remote/并且似乎没有关于远程数据源的外观或工作方式的文档。

在该页面中，您可以看到远程数据源的 JS 示例是 http://gd.geobytes.com/AutoCompleteCity，但访问该 URL 不会显示任何内容。

有谁知道它应该如何构造以便与自动完成页面一起使用？

Answer 1

数据以 JSON 形式作为数组返回。在文档的示例中，如果你看一下 JS 代码:

$.ajax({
dataType: "jsonp"
...
.then(function(response) {  // <-- this expects response as a JSON object
$.each(response,function(i,val){  // <-- each iterates over the array, i is the index, val is the value
    html+="<li>"+val+"</li>"; //<-- creates the HTML for the autocomplete

})

事实上，您可以使用 Chrome 上的 Google 开发者工具来查看响应。在示例中，如果您写“Ale”，您会得到:

jQuery1102023577826283872128_1446566971852(["Aledo, IL, United States","Aledo, MU, Spain","Aledo, TX, United States","Aleknagik, AK, United States","Aleppo, HL, Syria","Aleppo, PA, United States","Alert, NT, Canada","alesund, MR, Norway","Alex, OK, United States","Alexander City, AL, United States","Alexander, AR, United States","Alexander, IA, United States","Alexander, IL, United States","Alexander, KS, United States","Alexander, NC, United States","Alexander, ND, United States","Alexander, NY, United States","Alexandra Headland, QL, Australia","Alexandra Hills, QL, Australia","Alexandra, GT, South Africa"]);

您可以尝试使用变量 q 将查询作为参数传递的示例 URL:

http://gd.geobytes.com/AutoCompleteCity?q=abe