IE瀏覽器中圖片onload事件無(wú)效的解決方法
故事模式實(shí)現(xiàn)是只加載當(dāng)前瀏覽的照片和它下面的兩張照片，加載照片的時(shí)候才會(huì)加載和渲染評(píng)論區(qū)，圖片沒(méi)有加載前會(huì)用一個(gè)一象素的圖片占位，并用一個(gè)loading類將顯示出一個(gè)loading背景圖，判斷在可視區(qū)的時(shí)候替換成真正的圖片，圖片加載成功后刪除loading類。
問(wèn)題出在最后面，測(cè)試的時(shí)候發(fā)現(xiàn)在IE下loading類無(wú)法刪除,當(dāng)時(shí)代碼如下：
img.src = _src;
img.src = _src;
img.onload = function(){
_con.delClass('loading');
}
網(wǎng)上找了一番，onload和定義src的語(yǔ)句應(yīng)該換一下順序，IE從緩存中取圖片，onload根本不觸發(fā)，opera也有這個(gè)毛病，正確代碼修改如下
img.onload = function(){
_con.delClass('loading');
};
img.src = _src;
立即就正常了
結(jié)論：應(yīng)該把onload寫到src前面，先告訴瀏覽器圖片加載完要怎么處理，再讓它去加載圖片。 所以，不是IE瀏覽器不會(huì)觸發(fā)onload事件，而是因?yàn)榧虞d緩沖區(qū)的速度太快，在沒(méi)有告訴它加載完要怎么辦時(shí)，它已經(jīng)加載完了。反過(guò)來(lái)說(shuō)，firefox明顯更智能一些，加入onload事件后，firefox瀏覽器會(huì)檢測(cè)緩沖區(qū)是否已經(jīng)有此圖片，有的話直接就觸發(fā)此事件！
相關(guān)文章
Util.js文件包含了一些工具函數(shù)，來(lái)幫助人們使用JavaScript數(shù)據(jù)（例如從服務(wù)器返回的數(shù)據(jù)）來(lái)更新Web頁(yè)面。有需要的小伙伴可以參考下2015-06-06
STL是一種用于表示3D模型表面的文件格式,通常由三角形面片組成,STL 文件可以是ASCII（文本）或二進(jìn)制格式,其中二進(jìn)制格式更為常見(jiàn),因?yàn)樗o湊且加載速度更快,本文給大家介紹了javascript加載導(dǎo)出 STL文件的示例,需要的朋友可以參考下2024-12-12
麥雞的TAB切換功能代碼2008-10-10
這篇文章主要介紹了JS煙花背景效果實(shí)現(xiàn)方法,實(shí)例分析了javascript操作dom元素實(shí)現(xiàn)煙花特效的技巧,需要的朋友可以參考下2015-03-03
梳理總結(jié)JavaScript的23個(gè)String方法
文章主要介紹了梳理總結(jié)JavaScript的23個(gè)String方法,JavaScript?中的String類型用于表示文本型的數(shù)據(jù)。它是由無(wú)符號(hào)整數(shù)值作為元素而組成的集合,更多詳細(xì)內(nèi)容需要的朋友可以參考一下2022-07-07
console.log()、alert()?都是JavaScript中用于在開(kāi)發(fā)過(guò)程中輸出信息或向用戶顯示消息的不同方法,它們的主要區(qū)別在于目的、使用場(chǎng)景以及展示方式,本文將給大家介紹JavaScript?中怎么看數(shù)據(jù)返回值,需要的朋友可以參考下2024-07-07
js+css實(shí)現(xiàn)增加表單可用性之提示文字
平常設(shè)計(jì)表單的時(shí)候，我們會(huì)加入一些提示文字，最常見(jiàn)的做法是利用value來(lái)設(shè)置，下面與大家分享一個(gè)實(shí)例，感興趣的朋友可以參考下哈2013-06-06
一文秒懂JavaScript構(gòu)造函數(shù)、實(shí)例、原型對(duì)象以及原型鏈
這篇文章主要介紹了一文秒懂JavaScript構(gòu)造函數(shù)、實(shí)例、原型對(duì)象以及原型鏈的相關(guān)知識(shí)，本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-08-08
javascript高級(jí)模塊化require.js的具體使用方法
本篇文章主要介紹了javascript高級(jí)模塊化require.js的具體使用方法，非常具有實(shí)用價(jià)值，需要的朋友可以參考下2017-10-10
JavaScript實(shí)時(shí)監(jiān)聽(tīng)localStorage變化的實(shí)現(xiàn)方法小結(jié)
很多時(shí)候,我們?cè)贏頁(yè)面通過(guò)點(diǎn)擊之類的操作獲得一個(gè)數(shù)值,然后拿到B頁(yè)面使用,我們希望這個(gè)值是響應(yīng)式的,當(dāng)然你可以使用vue或者react的實(shí)現(xiàn),這篇文章適合想偷懶或者很多后端小伙不愿意去用的使用,效果是差不多的主要是適用于任何基于JavaScript的項(xiàng)目,需要的朋友可以參考下2024-06-06