JavaScriptのイベント処理のバックアップ(No.2) - .NET 開発基盤部会 Wiki

[ トップ ] [ 新規 | 一覧 | 単語検索 | 最終更新 | ヘルプ ]

バックアップ一覧
差分を表示
現在との差分を表示
ソースを表示
JavaScriptのイベント処理へ行く。
- 1 (2018-01-31 (水) 12:12:30)
- 2 (2018-01-31 (水) 12:22:14)

「.NET 開発基盤部会 Wiki」は、「Open棟梁Project」,「OSSコンソーシアム .NET開発基盤部会」によって運営されています。

戻る

目次 †

目次
概要
初期処理
- load
- ready
- 比較
参考

概要 †

イベント処理は

イベントリスナーにイベントハンドラ（delegate）を設定する。
jQueryでも記述できる。

初期処理 †

load †

loadイベントは以下のように記述できる。

window.onloadを使う。

window.onload = function() {
  // ・・・処理・・・
};

addEventListener?を使う。

window.addEventListener("load", function() {
  // ・・・処理・・・
}, false);

ready †

$(document).ready(function () {
  // ・・・処理・・・
});

ready(fn) - jQuery 日本語リファレンス
http://semooh.jp/jquery/api/events/ready/fn/
$(document).ready() と $(window).load() の違い | こととこネット
http://blog.cototoco.net/work/201308/window-onload-%E3%81%A8jqurydocument-ready-%E3%81%AE%E9%81%95%E3%81%84/

比較 †

loadは、画像などのリソースのロードが済んだ時点、
タグがロードされていないと処理できない初期処理はコチラで処理する。
readyはDOMロード後なのでonLoadより早いタイミングで動き出す。

参考 †

イベントリファレンス - Web 技術のリファレンス | MDN
https://developer.mozilla.org/ja/docs/Web/Reference/Events
EventTarget?.addEventListener? - Web API インターフェイス | MDN
https://developer.mozilla.org/ja/docs/Web/API/EventTarget/addEventListener

Events - jQuery 日本語リファレンス
http://semooh.jp/jquery/api/events/
jQuery：イベントに応じて処理を実行するには？（イベントメソッド） - Build Insider
http://www.buildinsider.net/web/jqueryref/015