|
|
茫茫網海中的冷日
發生過的事,不可能遺忘,只是想不起來而已! |
|
恭喜您是本站第 1704350
位訪客!
登入 | 註冊
|
|
|
|
發表者 |
討論內容 |
冷日 (冷日) |
發表時間:2011/6/13 3:28 |
- Webmaster
- 註冊日: 2008/2/19
- 來自:
- 發表數: 15771
|
- [轉貼]解決IE中img.onload失效的方法
- 解決IE中img.onload失效的方法
2011-02-25 16:08
最近在做一個web項目,其中有一個需求:在服務端圖片未下載完成之前顯示另一個圖片,下載完成後才顯示此圖片,所以想到了img的onload方法,開發完成後,在firefox瀏覽器下沒有什麼問題,在IE下測試,發現img的onload事件很多情況下都不被調用。
我最初的代碼如下:
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
var obj = new Image();
obj.src = "http://dl.zhishi.sina.com.cn/upload/21/01/14/1172210114.4452029.jpg";
obj.onload = function()
{
$("img").attr('src',this.src);
alert(this.src);
}
</script>
<div id="mypic"><img src="../images/loading.gif" /></div>
這段代碼看上去沒什麼問題,但是為什麼onload在ie下經常沒有被調用呢?因為瀏覽器會緩存圖片,第2次加載的圖片,不是從服務器上傳過來的,瀏覽器不會向服務端發送請求,而是從緩衝區裡加載的。是不是從緩衝區裡加載的圖片就不觸發onload事件呢?但alert每次都是執行的,所以猜測是錯誤的,於是我把代碼做了一下修改如下
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script>
var obj = new Image();
obj.onload = function()
{
$("img").attr('src',this.src);
alert(this.src);
}
obj.src = "http://dl.zhishi.sina.com.cn/upload/21/01/14/1172210114.4452029.jpg";
</script>
<div id="mypic"><img src="../images/loading.gif" /></div>
我把onload事件寫到給imgage對象的src賦值之前了,先告訴瀏覽器如何處理這張圖片,再指定這張圖片的源,這樣就正常了。所以,不是IE瀏覽器沒有觸發onload事件,而是因為加載緩衝區的速度太快了,以至於沒有運行到obj.onload的時候,onload事件已經觸發了。
原文出處:解决IE中img.onload失效的方法_记录_百度空间
|
|
討論串
|