将远程数据传递给自动完成

时间:2011-12-16 06:12:17

标签: jquery jquery-ui autocomplete jquery-autocomplete

 $(document).ready(function () {
          $("#example").autocomplete("https://graph.facebook.com/me/friends?access_token=" + accessToken + "&callback=?", {

               width: 250,
               height: 400,
               max: 8,
               dataType: 'jsonp',
              cacheLength: 10,
               minChars: 1,
               parse: function (data) {
                   var rows = new Array();
                   data = data.data;
                   for (var i = 0; i < data.length; i++) {
                       rows[i] = { data: data[i], value: data[i].name, result: data[i].name };
                   }
                   return rows;
               },
               formatItem: function (data, i, n, value, text, a, b, c, d) {
                   var x = getImage(data.id);
                   return "<div class='test2'><img class='test' width='32px' height='32px' src='" + x + "'></img><span>" + data.name + "</span></div>";
               },

          }
             ).result(function (evnet, item) {
                 alert(item.id);       
            });
     });

     <input type="text" id="example"/>

我正在使用此代码为facebook朋友自动提供。它工作,但它太慢,因为每次自动完成功能从远程位置搜索数据。

是否有其他方法可以通过保存变量并将其传递给.autocomplete()函数来传递远程数据。

后来我尝试将远程数据保存到变量,但我无法将变量传递给自动完成。

jQuery(document).ready(function(){

var aToken = document.getElementById('aToken').value;
jQuery.getJSON("https://graph.facebook.com/me/friends?access_token="+aToken, function(data) {
    var data = data;
});
    jQuery("#name_inp").autocomplete({
       width: 500,
       height: 200,
   max: 5000,
   source: data,
        dataType: 'jsonp',
        cacheLength: 10,
       minChars: 1,
        parse: function (data) {
            var rows = new Array();
           data = data.data;
            for (var i = 0; i < data.length; i++) {
                rows[i] = { data: data[i], value: data[i].name, result: data[i].name };
           }
             return rows;
         },
        formatItem: function (data, i, n, value, text, a, b, c, d) {
            var x = getImage(data.id);
             return "<div class='test2' onclick='return getId("+data.id+");'><span>" + data.name + "</span></div>";
       },

   }
     )
 });

1 个答案:

答案 0 :(得分:0)

  1. 您可以检索完整的好友列表并将其存储在本地。然后,不要进行远程调用,而是搜索本地数据。
  2. 同时设置noCache: false它将缓存请求并将首先在缓存中搜索
  3. 尝试良好的网络连接。 :)
  4. 修改
    试试这个。在这里,我将结果存储在userList变量中,该变量可用作自动完成源。

    $(function() {
            userList = null; 
            $.getJSON("https://graph.facebook.com/me/friends", {access_token:access_token,callback:"?"}, function(users) {
                     userList = users;
                 });  
        });     
    

    或者你可以试试这个

    $(function() {
            userList = null; 
            $.getJSON("https://graph.facebook.com/me/friends?access_token=" + accessToken + "&callback=?",function(users) {
                     userList = users;
                 });  
        });     
    

    我从未使用Facebook API,因此不确定要传递哪些参数。