遠程數據源如何在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