在chrome中window.onload事件的一些問題
更新時間：2010年03月01日 19:29:00 作者：
在寫一些關(guān)于圖片操作的代碼的時候，一般都需要在圖片加載完成之后再執(zhí)行程序。然而在Chorme中（貌似Safari也是）對window.onload的理解與IE和FF有偏差。
假如我們有一個如下的頁面：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
</head>
<body>
<img src="/upload/2010-3/20100301192859481.gif" alt="" id="image">
<script type="text/javascript">
var init=function (){
var img=document.getElementById('image');
alert(img.offsetWidth);
}
window.onload=new init();
</script>
</body>
</html>
在IE和FF下運(yùn)行的時候都是可以顯示圖片的真實大小的，即使我并沒有顯示的說明這個img的width和height。但是在chrome下，則顯示的是0。
但是如果將window.onload后面的new init()改為
window.onload=init
或者
window.onload=function(){new init(){}}
就可以在圖片加載之后讀出圖片的大小。
轉(zhuǎn)載請保留以下信息
作者：北玉(tw:@rehawk)
復(fù)制代碼 代碼如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
</head>
<body>
<img src="/upload/2010-3/20100301192859481.gif" alt="" id="image">
<script type="text/javascript">
var init=function (){
var img=document.getElementById('image');
alert(img.offsetWidth);
}
window.onload=new init();
</script>
</body>
</html>
在IE和FF下運(yùn)行的時候都是可以顯示圖片的真實大小的，即使我并沒有顯示的說明這個img的width和height。但是在chrome下，則顯示的是0。
但是如果將window.onload后面的new init()改為
window.onload=init
或者
window.onload=function(){new init(){}}
就可以在圖片加載之后讀出圖片的大小。
轉(zhuǎn)載請保留以下信息
作者：北玉(tw:@rehawk)
相關(guān)文章
本文主要介紹了JavaScript實現(xiàn)分頁效果的示例代碼。具有很好的參考價值。下面跟著小編一起來看下吧2017-03-03
這篇文章主要介紹了JavaScript中跨域調(diào)用Flash的方法,只需要在Flash中加一句話即可,需要的朋友可以參考下2014-08-08
在?JavaScript?中使用變量或常量之前，必須先進(jìn)行聲明，這篇文章主要介紹了JavaScript中的變量聲明與賦值,本文通過示例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-08-08
本文主要介紹在uniapp中頁面與webview組件內(nèi)頁面的雙向通信問題,本文通過圖文實例代碼相結(jié)合給大家介紹的非常詳細(xì),感興趣的朋友跟隨小編一起看看吧2024-07-07
微信小程序的運(yùn)行機(jī)制與安全機(jī)制解決方案詳解
這篇文章主要介紹了微信小程序的運(yùn)行機(jī)制與安全機(jī)制解決方案，接觸小程序有一段時間了，總得來說小程序開發(fā)門檻比較低，但其中基本的運(yùn)行機(jī)制和原理還是要懂的2023-02-02
CheckBox多選取值及判斷CheckBox選中是否為空的實例
下面小編就為大家?guī)硪黄狢heckBox多選取值及判斷CheckBox選中是否為空的實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
JS實現(xiàn)獲取漢字首字母拼音、全拼音及混拼音的方法
這篇文章主要介紹了JS實現(xiàn)獲取漢字首字母拼音、全拼音及混拼音的方法,涉及針對ChinesePY.js插件的使用及事件響應(yīng)相關(guān)操作技巧,需要的朋友可以參考下2017-11-11
JavaScript動態(tài)設(shè)置div的樣式的方法
這篇文章主要介紹了JavaScript動態(tài)設(shè)置div的樣式的方法的相關(guān)資料,需要的朋友可以參考下2015-12-12
項目開發(fā)過程中遇到JSON字符串回顯的情況,直接顯示的話效果很丑,不方便查看,因此需要在前端頁面對JSON進(jìn)行格式化顯示,下面這篇文章主要給大家介紹了關(guān)于前端顯示json格式化的相關(guān)資料,需要的朋友可以參考下2024-03-03
這篇文章主要為大家詳細(xì)介紹了js實現(xiàn)簡單頁面全屏的功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-09-09