ベストアンサー

bodyタグのfocus

2011/07/23 23:12

jqueryで $('body').focus(function() { alert('focus'); }); などと記述しても、フォーカス時にうまくアラートが表示されません。 Bodyタグにonfocusとして直接書くと動作するのですが、何か違いがあるのでしょうか？よろしくお願いします。

sakukou10
お礼率56% (42/75)

JavaScript
回答数5
ありがとう数1

みんなの回答 （5）
専門家の回答

質問者が選んだベストアンサー

ベストアンサー

神崎渉瑠（@taloo）
ベストアンサー率44% (1016/2280)

2011/07/24 08:00 回答No.5

http://dev.w3.org/html5/spec/sections.html#the-body-element HTML5の方を読むと、『window.onfocusはHTMLタグとして書けないから、<body onfocus="">で書いてちょ。ブラウザはwindowに置き換えてちょ。』ということのようですね。 HTMLとJavaScriptの関係では、document.body.onfocusは<body onfocus="">と同等なのでwindowにマッピングされるのかもしれませんが、 addEventListenerによるイベントリスナーの登録は別物なので、文字通り<body>にフォーカスが当たらなければonfocusイベントが呼び出されないと思います。 jQueryは全面的にaddEventListener/attachEventを使っていると思いますので、 jQueryを使うと、結果的にbodyに登録されたイベントリスナーが呼び出されなくなると思います。デフォルトでフォーカスが当たる要素は下のページにあるように<a>や<input>などです。 <body>にフォーカスを当てる方法としてNo.3とおりtabindexが使えるようです。 http://dev.w3.org/html5/spec/editing.html#specially-focusable >An element is specially focusable if the tabindex attribute's definition above defines the element to be focusable.

ログインすると、全ての回答が全文表示されます。

その他の回答 (4)

Chaire
ベストアンサー率60% (79/130)

2011/07/24 05:40 回答No.4

ごめんなさい、寝ぼけてすごく的外れなことを書きました。No.3 は全面撤回します。jQuery に問題はなく、No.2 が正しいです。 body は（そのままでは）キーボードフォーカスの対象になりませんので、body で focus を監視してもイベントリスナに通知されません。body でキーボードフォーカスを拾えるようにするには <body tabindex="0"> のように 0 以上の tabindex を付加します。しかし、それはウィンドウ全体のフォーカスではありません。もしウィンドウのフォーカスを拾いたければ、No.2 が仰るように window を監視します。失礼しました。

ログインすると、全ての回答が全文表示されます。

Chaire
ベストアンサー率60% (79/130)

2011/07/24 05:04 回答No.3

jQuery 1.6.1 を追跡すれば分かりますが、本来内部的に document.addEventListener('focus', handler, true); // キャプチャリング document.attachEvent('onfocusin', handler); // イベント名は "focusin" のように修正されるべき所がスルーされて、"focus" のバブリングのまま登録されているからです。修正コードは jQuery に含まれているはずですが、それが実行されないバグなのか、何か他の手順が必要なのか、jQuery のリファレンスないしバグトラッカーなどで確認して下さい（私は追いかける気はないので）。 --- なお、body の onfocus は DOM3 Events および HTML5 に収録されています。この部分は主要ブラウザ間の仕様調整にもとづく後づけ規定なので、今のブラウザでも動くと考えて構いません。それと、言うまでもありませんが一応。body（もしくは window）の focus イベントで alert() すると無限ループになる可能性があるので、十分注意して下さい。

ログインすると、全ての回答が全文表示されます。

神崎渉瑠（@taloo）
ベストアンサー率44% (1016/2280)

2011/07/24 03:16 回答No.2

http://www.w3.org/TR/html4/interact/scripts.html#events <body onfocus="">はHTMLやDOMとして定義されていませんので、ブラウザ依存になるはずです。 window.onfocus、window.onloadなどで処理した方が確実だと思います。

ログインすると、全ての回答が全文表示されます。