远程数据源如何在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的谷歌开发者工具查看响应。在这个例子中，如果你写“啤酒”你：

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"]); 

你可以试用此例的URL中使用的变量q传递一个查询作为参数：

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