从外部JSON文件抓取数组值和标签并将其添加到jQuery自动完成功能

Question

我正在尝试将jQuery UI自动完成添加到输入字段。类似于此示例：http://jqueryui.com/demos/autocomplete/#default

<script> 
    $(function() { 
     var availableTags = [ 
      "ActionScript", 
      "AppleScript", 
      "Asp", 
      "BASIC" 
]; 
     $("#tags").autocomplete({ 
      source: availableTags 
     }); 
    }); 
</script> 

我跟着演示，这是很容易做到。对我来说，最难的部分是把从另一个JSON文件名为albums.json数据：

{ 
    "albums": [ 
     { 
      "value": "Author Name", 
      "label": "Album Name" 
     }, 
     { 
      "value": "Author Name", 
      "label": "Album Name" 
     }, 
     { 
      "value": "Author Name", 
      "label": "Album Name" 
     }, 
     { 
      "value": "Author Name", 
      "label": "Album Name" 
     }, 
    ] 
} 

这是任何简单的方法来做到这一点？我一直试图弄清楚自己，但我不能。

由于提前，IL

Answer 1

您可以使用jQuery ajax从外部来源为自动完成数据获取数据。尝试这个。

$("#tags").autocomplete({ 
    source: function(request, response) { 
    $.ajax({ 
     url: "UrlOfThePage", 
     dataType: "json", 
     success: function(data) { 
     response(data.albums); 
     } 
    }); 
    } 
});