JQuery UI自動填充文本與多個字段的圖像

Question

我需要實現自動填充功能，其中顯示Facebook自動填充中的名稱和麪孔。
在這篇文章Jquery UI autocomplete - images IN the results overlay, not outside like the demo和在那篇文章中的演示http://jsfiddle.net/K5q5U/我發現了一個很好的方法來做到這一點。
該演示使用StackOverflow的API來搜索用戶，並在他們的左側顯示他們的頭像。
但問題是，它運作良好時，才呈現一個輸入字段，當我試圖將其更改爲幾個輸入字段只有第一個字段中顯示的圖像+文字，從圖像中忽略了第二場僅顯示自動填充文本。 （我從一個數據庫輸入字段，我不什麼現在是在先進領域的數量）

這裏是我使用

<input class="auto" type="text" /> 
<input class="auto" type="text" /> 

$(document).ready(function() { 
    $(".auto").autocomplete({ 
     source: function (request, response) { 
      $.ajax({ 
       url: "http://api.stackoverflow.com/1.1/users", 
       data: { 
        filter: request.term, 
        pagesize: 10 
       }, 
       jsonp: "jsonp", 
       dataType: "jsonp", 
       success: function(data) { 
        response($.map(data.users, function(el, index) { 
         return { 
          value: el.display_name, 
          avatar: "http://www.gravatar.com/avatar/" + 
           el.email_hash 
         }; 
        })); 
       } 
      }); 
     } 
    }).data("autocomplete")._renderItem = function (ul, item) { 
     return $("<li />") 
      .data("item.autocomplete", item) 
      .append("<a><img src='" + item.avatar + "' />" + item.value + "</a>") 
      .appendTo(ul); 
    };  
}); 

任何幫助的代碼，可以告訴我怎麼可以調整它，所以自定義圖像+文字自動完成將顯示在幾個字段將非常讚賞。

Answer 1

也許這是一個錯誤。試試這個解決方法：

$(".auto").each(function() { 

    $(this).autocomplete({  
    // put here remaining code 


});