jQuery自動完成圖像

Question

我想在我的網站中實現圖像的自動完成功能。

我想使用jQuery自動完成插件。

我看看他們的示例代碼。

任何人都可以解釋我什麼下面的代碼意味着在$（文件）。就緒（）事件：

$("#imageSearch").autocomplete("images.php", { 
    width: 320, 
    max: 4, 
    highlight: false, 
    scroll: true, 
    scrollHeight: 300, 
    formatItem: function(data, i, n, value) { 
    return "<img src='images/" + value + "'/> " + value.split(".")[0]; 
    }, 
    formatResult: function(data, value) { 
    return value.split(".")[0]; 
    } 
}); 

我的最終要求是當我輸入在文本框中輸入一些字母，我想要的選項附帶與其相關的圖像。

Answer 1

使用此以供參考：http://api.jqueryui.com/autocomplete/

---

$("#imageSearch").autocomplete("images.php", { 

應用pluging自動完成所有領域#imageSearch。第一個參數我猜它是根據輸入內容（images.php）生成響應的頁面;

 width: 320, 

寬度下拉

 max: 4, 

最大建議

 highlight: false, 

高亮真/假

 scroll: true, 

滾動條又名下拉類型的列表，或只是一個很長的div。

 scrollHeight: 300, 

自動完成下拉的高度。

 formatItem: function(data, i, n, value) { 
      return "<img src='images/" + value + "'/> " + value.split(".")[0]; 
     }, 

如何格式化從images.php返回的響應。

 formatResult: function(data, value) { 
      return value.split(".")[0]; 
     } 

如何返回值，如果用戶選擇其中一個選項。

}); 

右括號：對

Answer 2

這是一個關於jQuery的自動完成插件，有實際jQuery UI的自動完成沒有這樣的選擇，因爲formatItem和formatValue。

我建議大家閱讀這個http://www.learningjquery.com/2010/06/autocomplete-migration-guide，它解釋瞭如何從舊插件版本遷移到官方UI小部件。

爲了讓你自動完成的建議清單，圖像加工你應該閱讀此線程：http://forum.jquery.com/topic/using-html-in-autocomplete