javascript - キーボードまたはマウスのイベントが Div で行われることを確認する

Question

キーボードまたはマウスのイベントが div 内で行われたかどうかを確認するにはどうすればよいですか?

div の onmousemove() イベントを確認すると機能しますが、onkeyup、onkeypress などは div に対して機能しません。

その理由は何ですか？

<div onmousemove="alert(1);" onkeypress="alert(2);">

ここでは、alert(1) が表示されますが、alert(2) は表示されません。

score 2 · Accepted Answer

このフィドルをチェックしてください。フォーカスと入力を許可しない要素でキーイベントを発生させることはできません...それは可能かもしれませんがcontenteditable、私にはわかりません... fiddleの入力内でキープレスを行うと、divのonkeypressトリガーしています

編集: div に tabindex="0" を設定して、それをフォーカス可能にすることもできることを発見しました (更新された新しい fiddleを参照)。入力は必要ありませんが、TAB キーを使用してフォーカス可能な要素を移動するときに干渉します

score 1 · Accepted Answer

div にはフォーカスが必要です。
方法は次のとおりです。

1- タブインデックス:

// JQ
$("#divID")
    .attr("tabindex", "0")
    .keydown(function(){ /* ... bla bla bla ... */ return false; });

または

// JS
<div id="divID"
     width="500px"
     height="500px"
     tabindex="1">
</div>

$("#divID").attr("contentEditable", "true")

または

$("#divID")[0].contentEditable = true;