ビジネスマンの徹底パソコン奮闘サイト

お知らせ
2011-03-16: 目次を作成しました。
2010-09-17: Google Map 2 記事一覧を作成しました。
2010-07-03: Google Map 3 記事一覧を作成しました。

スポンサーサイト

--年 --月--日 (-- )
上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

onloadが複数で困ったら(Javascript編)

2010年 04月09日 (金 )
ブログを作成していて、javascriptで色々と機能を追加していくと
なにやら急にある機能が動かなくなったりした経験はありませんか?

そういった場合、原因は色々あると思いますが
一番良くある例はonloadが複数存在してしまっている事だと思います。

window.onloadは複数存在する場合、
一番最後に実行されたものだけが生き残ると言う性質があります。
なので、例えば

<script src="abc.js" type="text/javascript"></script>
<script src="xyz.js" type="text/javascript"></script>

とコーディングされていて、両方に
window.onloadがあった場合、
xyz.jsのonloadしか実行されません。

別記事で「jQuery」を使用した回避方法を紹介しましたが、
今回は「javascript」のみで回避してみたいと思います。

下記のコードを参照して下さい。


このコードだと1つ目のonloadが2つ目のonloadに消されてしまい、
alertは"2"しか表示されません。

そこで、下記の様に書き換えます。

こうする事によりonloadイベントが追加されると言う形になるので、
最初のonloadイベントも実行されます。

ただし、この場合は追加と言うことなので呼び出される順番は、
window.onloadで定義した関数より後になります。

つまり、alertの順番は"2","1"となります。

また、IEでは「addEventListener」をサポートしていないため、
「attachEvent」を使用しています。

上記のコードでは「addOnload()」の中にfunctionを入れていますが、
別に関数を用意して、その関数名を入れても同じです。


以上、複数onload時のjavascriptでの回避方法でした。
jQueryでの回避方法もありますので、良かったらご覧下さい。

コメント

コメントの投稿

  • URL
  • コメント
  • パスワード
  • 秘密
  • 管理者にだけ表示を許可する

トラックバック

トラックバックURL:http://pcrice.blog129.fc2.com/tb.php/11-6e701fec
UIwebViewDelegateを利用すれば Source code   ? webView:shouldStartLoadWithRequest:navigationType: ? webViewDidStartLoad: ? webViewDidFinishLoad: ? webView:didFailLoadWithError: の四つのイベントを受け取れるようになるのだけれど、それぞれ「?...
2010/11/18(木) 18:44:50 | iPhone・iPadアプリの開発日誌
  ビジネスマンの徹底パソコン奮闘サイト  
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。