jQuery：.load圖片，然後fadeIn（）失敗，當點擊兩次！

所以我有一個.fadeIn（）回調的圖像.load設置，工作得很好。問題是，如果我在相同的圖像上連續兩次觸發.load，它不會到達回調！jQuery：.load圖片，然後fadeIn（）失敗，當點擊兩次！

這裏的代碼片段：

$('#thumbs a').click(function() { 
    imageSrc = $(this).attr('href').substring(1)+'.jpg'; // grab src, remove hash, add jpeg extension 
    $('#viewer img').fadeOut('fast', function() {  // fade old image out fast, wait until finished before changing src 
    $('#viewer img').attr('src', (mediumPath+imageSrc)); // change src to new image 
    $('#viewer a').attr('href', imageSrc); 
    }); 
    $('#viewer img').load(function(){  // once image is loaded, fade the img back in 
     $('#viewer img').fadeIn('slow'); 
     }); 
    return false; 
});

而且你可以嘗試在我的網站（在建）here。只需點擊左側的縮略圖兩次，loader.gif就不會消失，即不會進入.fadeIn（）。

注意：（？）我相信這僅僅是影響WebKit瀏覽器

來源

2010-07-26 Benji

我已經在Chrome瀏覽器測試您的網站http://www.benjibee.com/（基於Webkit的瀏覽器，因爲據我所知），並一直未能複製問題。雖然它的確需要比Firefox更長的時間（但那可能只是我的電腦）。

一些建議/意見。

與您.click()基於交互，使用格式：

.click(function(e) { 
    e.preventDefault(); 
    // Rest of your Javascript Code here... 
});

將執行這樣停錨/鏈接，並且可以在jQuery的處理開始被誘發，而不是等待結束使用return false。

您可能還想在JavaScript變量中存儲當前圖像/鏈接的詳細信息，然後在縮略圖上進行後續點擊時進行檢查 - 如果顯示img1.jpg，並且該圖像的縮略圖被點擊，當前較大的圖像淡出，然後再次消失，沒有變化。只是一件小事。

來源

2010-07-26 07:47:35

感謝您的關注，我很感激。我想我不應該在這個網站上指點人，而我正在積極研究這個網站，呵呵。我現在將在本地副本上工作，因爲它代表了已經存在的繁瑣頁面。至於返回false，我意識到另一種方法，我粘貼了那些內容，因爲我計劃使用jQuery BBQ進行散列導航，但是希望在構建其他代碼時擺脫它們。 – Benji 2010-07-26 08:14:48

jQuery：.load圖片，然後fadeIn（）失敗，當點擊兩次！

回答

相關問題