我如何使用ajax請求獲取數據

Question

我正在使用this jquery ui自動完成，但我需要從每個按鍵的json對象中獲取數據，並在用戶鍵入時將其放入下拉列表中。但這個例子只使用一個數組

<script type="text/javascript"> 
$(function() { 
    var availableTags = ["ActionScript", "AppleScript", "Asp", "BASIC", "C", "C++", "Clojure", "COBOL", "ColdFusion", "Erlang", "Fortran", "Groovy", "Haskell", "Java", "JavaScript", "Lisp", "Perl", "PHP", "Python", "Ruby", "Scala", "Scheme"]; 
    $("#request_artist").autocomplete({ 
     source: availableTags 
    }); 
}); 
</script> 

我想這樣做的按鍵Ajax請求，但完全違背了自動填充功能

Answer 1

有一個在插件在http://jqueryui.com/demos/autocomplete/#remote-jsonp頁面只需點擊一個例子查看源代碼鏈接。相關部分是：

$("#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"); 
     } 
    });