.autocomplete() 带有远程 json 的数据

Question

我在使用 .autocomplete 功能时遇到了一些问题。 我有什么：

<script type="text/javascript">

$( ".search" ).autocomplete({
      source: [{label:'link label1', searchLink:'http://link1.com'},
               {label:'link label2', searchLink:'http://link2.com'},
               {label:'link label3', searchLink:'http://link3.com'}],
      select:function(e,ui) { 
      location.href = ui.item.searchLink;
}
});
</script>

我需要将此 json 内容放入直接文件并使用此自动完成数据从中读取数据：

{
{label:'link label1', searchLink:'http://link1.com'},
{label:'link label2', searchLink:'http://link2.com'},
{label:'link label3', searchLink:'http://link3.com'}
}

有人可以帮我吗？）也许使用 $.getJSON() 的某种方式会是很好的解决方案:)

Answer 1

基本上下面是你需要做的。

$("#autocomplete").autocomplete({
                delay: 500,
                minLength: 3,
                source: function(request, response) {
                    $.getJSON("JSON file name", {                       
                        q: request.term,
                        page_limit: 10
                    }, function(data) {
                        // data is an array of objects and must be transformed for autocomplete to use
                        var array = $.map(data, function(m) {
                            return {
                                label: m.lable,
                                searchLink: m.searchLink
                            };
                        });
                        response(array);
                    });
                }
            });

下面的帖子解释了如何使用远程 JSON 自动完成。

http://salman-w.blogspot.com/2013/12/jquery-ui-autocomplete-examples.html#example-3

它也有完整的代码

Answer 2

尝试编写回调来处理数据；

$.getJSON('getSource.url',function(data){
       /* Work with your data here */
})

您可能会发现jQuery UI autocomplete with objects 很有用