2011-01-05 52 views
1

我正在使用jQuery自動完成插件來顯示用戶列表及其來自我的數據庫的照片。當我顯示沒有用戶圖像的結果時,自動完成速度非常快。但對於圖像,圖像需要一些時間才能加載和顯示。我瞭解圖像會下載並顯示出來。但是,在臉書上,圖像即時顯示。據我所知,Facebook使用高配置服務器來返回值,並使用其他一些技術來顯示圖像。有沒有辦法可以將我的圖像存儲在數據庫或其他可以即時訪問的地方?我正在使用Web服務以json格式返回值。使用jQuery自動完成加載圖像

+0

你存儲圖像或鏈接數據庫中的圖像? – RAMe0 2011-01-05 06:16:03

+0

截至目前,我正在存儲指向圖像的鏈接,然後通過指向img標籤的src來顯示它們。 – Ashish 2011-01-05 06:29:58

回答

1

您可以嘗試加載文本數據後加載圖像。 例如,您可以創建包含空白圖像(<img class="searchThumb" src="blank.gif"/>)和attr img_source的結果,其中將包含實際圖像的網址(<img class="searchThumb" src="blank.gif" img_source="/real_img_url.jpg"/>)。同時添加功能open將顯示圖像的事件。

簡單的例子(它只是例子,我沒有測試)

$(function() { 
    function showImages(){ 
     $(".searchThumb").each(function(){ 
      $(this).arrt("src", $(this).attr("img_source")); 
     }); 
    } 
    $("#birds").autocomplete({ 
     source: "search.php", 
     minLength: 2, 
     open: showImages() 
    }); 
}); 

UPD

$(function() { 
    function showImages(){ 
     $(".searchThumb").each(function(){ 
      $(this).arrt("src", $(this).attr("img_source")); 
     }); 
    } 
    function formatItemFn(row,pos,count,term){ 
     // Here is formatting like I described before 
     if (pos==count) showImages(); 
    } 
    $("#birds").autocomplete({ 
     source: "search.php", 
     minLength: 2, 
     formatItem: formatItemFn() 
    }); 
}); 
+0

打開不是自動完成的選項。我也嘗試過formatResult。但沒有運氣。 – Ashish 2011-01-05 09:16:12

+0

@Ashish我剛剛查過[jQuery UI Autocomplit頁面](http://jqueryui.com/demos/autocomplete/)選項卡「事件」。自動完成有事件「打開」。來自UI文檔的描述:'當建議菜單被打開時觸發'。在那裏你可以找到使用'open'事件的例子。是的,你是正確的'打開'不是一個選項這是事件。 – RAMe0 2011-01-05 09:33:57

+0

我正在使用jQuery自動完成插件,而不是jQuery UI自動完成。 (http://docs.jquery.com/Plugins/Autocomplete/autocomplete) – Ashish 2011-01-05 09:58:41