需要幫助加載內容通過AJAX

Question

請看下面的代碼：

$(".workSnippet").click(function() { 

    //set variable portfolioCount based on index 

    portfolioCount = $(".workSnippet").index(this); 

    //load content based on portfolioCount 

    $('#work #cycle' + portfolioCount).load("ajax-content/ajax-content.php #portfolioImage" + portfolioCount); 

    // when loaded, run animation functions 

    $("#work").ajaxComplete(function(){ 

     //help required here 

     setTimeout(invokeMultipleCycle, 200); 

     showWork(); 

    }); 

在我的頁面上有多個「縮略圖」叫.workSnippet。當你點擊其中的一個時，我希望它通過ajax加載內容。它選擇要與索引函數一起加載的內容。我有這個工作非常好。

問題是，它有點混亂。當你點擊.workSnippet時，它會運行一個動畫，但是高質量的圖像在動畫發生時加載速度很慢。

我想要做什麼：

1. 等待Ajax請求完整加載功能invokeMultipleCycle和showWork之前。

2. 在動畫發生之前，添加一個絕對位於.workContent之上的ajax加載動畫。

請記住兩兩件事：

1. 有頁面上的多個.workSnippets。
2. 內容是不是加載在workSnippet中，但另一個div叫#work。

你會看到我已經嘗試過使用ajaxComplete函數。但是，它似乎並不奏效。也許這是因爲ajax請求完成，但圖像仍然需要「加載」？

您的幫助將不勝感激。

感謝，

史蒂夫

Answer 1

也許這是因爲AJAX 請求完成但圖像仍然 需要 '負荷'？

是的。加載圖像後您必須執行動畫。我想不出一個辦法來做到這一點，我的頭頂;我認爲尋找類似於document.ready（）的解決方案。