コードは次のとおりです：http：//jsfiddle.net/cPrSZ/2/
<p>Space changes focus to button</p>
<button id="b1">Button1</button>
var stopProp = function(event) {
event.stopPropagation()
event.preventDefault()
return false;
};
$("#b1").on("click", function(event) {
alert("Button1 Clicked");
return stopProp(event);
});
$("body").on("keydown", function(event) {
if (event.which === 32) {
$("#b1").focus();
}
return stopProp(event);
});
Firefoxで、段落をクリックしてボタンのフォーカスを失います。次に、スペースを押すと、私のコードではそうするように指示されていなくても、ボタンのクリックがトリガーされることがわかります。なぜこうなった？
の$("p").on("keydown",代わりにハンドラーをアタッチするとbody、正常に機能しているように見えますが、クリック可能な要素ごとにハンドラーを作成する必要がないようにしています。「キープレス」の代わりに「キーアップ」を付けると、物事も正しく機能します。しかし、私はhtml5ゲームを作成しており、応答性のためにキーアップではなくキープレスに反応できるようにしたいと考えています。
キーダウンハンドラーをキーアップハンドラーに変更する必要はないと思います。理由は次のとおりです。
Firefoxは、フォーカスが適用されている間、キーアップイベントの組み合わせをクリックと同じものとして解釈しているようです。私は次のコードでこのフィドルの問題を克服することができました：
$("body").on("keyup", function (event) {
if (event.target === document.getElementById('b1')) {
return stopProp(event);
}
});
この場合、キーアップがあるときはいつでも、それがボタンで発生したかどうかを確認します。もしそうなら、私たちはそれをキャンセルします。これにより、意図しないクリックがキャンセルされたようです。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加