加載圖像的jQuery

我有下面的代碼加載圖像後添加類後添加類：加載圖像的jQuery

$('.single aside img').attr('src', 'assets/img/ajax-loader.gif'); 

$('.single aside img').attr('src', url).load(function() { 
    $('.single aside img').addClass('loaded'); 
});

但它不工作時，它加載之前添加類。有任何想法嗎？

來源

2013-01-05 user1937021

您正在錯誤的報價...這是一個複製粘貼錯誤還是這是你的實際代碼？ – Lix

缺少的引號顯然只在問題中。「它在加載之前添加類」 - 如果存在語法錯誤，則不會發生這種情況。 – JJJ

我看到您的代碼錯誤的主要原因是在您的回調函數中，您使用的是原來使用的相同選擇器。

你想要做的是引用加載的實際元素。爲此，您可以使用$(this)關鍵字。

$('.single aside img').attr('src', url).load(function() { 
    $(this).addClass('loaded'); 
}); 

// another interpretation of the code... 
// var loaded = 'loadedClass'; 
// $('.single aside img').attr('src', url).load(function() { 
// $(this).addClass(loaded); 
// });

您的代碼中也有缺失的引號，但我懷疑這只是一個複製粘貼錯誤，所以我忽略了它。

來源

2013-01-06 00:03:46 Lix

非常感謝，但是由於某種原因，它在加載之前仍會添加該類。 – user1937021

@use - 加載函數的回調應該只在元素加載後觸發。你確定沒有其他代碼添加隱藏在某個地方的類嗎？ – Lix

嗯，我確實有這個，它只是在加載主圖像之前顯示loader.gif：...我會將它添加到上面的原始文章中。 – user1937021

load方法用於從服務器獲取數據（Ajax調用），如您在此處看到的：http://api.jquery.com/load/。您必須將一個load事件綁定到您的圖像。

var loaded = 'loadedClass'; 
$('.single aside img').attr('src', url).bind('load', function() { 
    $(this).addClass(loaded); 
});

來源

2013-01-06 04:40:55

加載圖像的jQuery

回答

相關問題