ホームページ  >  記事  >  ウェブフロントエンド  >  img onloadイベントバインディングはすべてのブラウザで実行可能_基礎知識

img onloadイベントバインディングはすべてのブラウザで実行可能_基礎知識

WBOY
WBOYオリジナル
2016-05-16 17:46:011263ブラウズ

img の onload イベントをバインドする必要がある場合、一般に、次のような従来の方法を使用してイベントをバインドすることを誰もが考えるでしょう:

Copy code コードは次のとおりです:





img onload イベント バインディング (誤った使用方法) >< スクリプトタイプ='text/javascript'>
window.onload = function(){
var img = document.getElementById('imgId');
アラート(1);
};
image/06 .jpg' id='imgId'/>



この時点で、次のアラートが表示されます。 )が実行されない理由は何ですか?特に IE および FF ブラウザでは。
そして、jquery プラグイン ライブラリを使用すると、IE および Opera ブラウザーではアラートがポップアップ表示されないことがわかりますが、他のブラウザーではポップアップ表示されます。これはなぜですか? !
主に、ページ dom 要素がロードされた後に window.onload イベントが実行されます。これには、img イメージ内の src ロードの完了も含まれます。その場合、img.onload は実行されません。
は、img の src がロードされているかどうかを監視しているためです。
では、onload イベントを img イメージにバインドするにはどうすればよいでしょうか?具体的なコードは次のとおりです。



コードをコピー


コードは次のとおりです。
< !DOCTYPE html PUBLIC "- //W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> xmlns="http://www.w3.org/1999/xhtml"> img onload イベント バインディング (正しい使用法)