1

Enter キーを押したときにポップアップ div を作成しようとしていますが、div には、Enter キーをもう一度押すと div を閉じるボタン (起動時にフォーカスするスクリプト) が含まれています。keypressバインディングからエンターキーを受け取り、keydown結果が異なります。

バインディング「キープレス」

最初のEnterキーでポップアップボックスが起動し、別のEnterキーでポップアップボックスを閉じると、正常に機能します。

このJSFiddleを参照してください。

バインディング「キーダウン」

これは正しく機能しません。エンター キーを 1 つ入力するだけで、ポップアップ ボックスが起動してすぐに閉じてしまいます (表示されません)。

このJSFiddleを参照してください。

私の質問は、なぜキーダウンが奇妙な動作を生成するのかということです.Enterキーを2回発砲するようなものですが、真実はそうではありませんでした. ボタン focus() を削除すると、正しく機能します。それは私を困惑させました。

firefox と chrome でテスト済み。

4

1 に答える 1

2

ポップアップが開くたびにクリックイベントを再バインドしているため、閉じるボタンをクリックするたびに複数回発生し、予期しない動作が発生します。

例えば：

var Popup = function(){
    $('#ok-button').live('click',function(){
        $('#popup').remove();
    });                
};

このコードは、新しい Popup インスタンスを作成するたびに、存在するすべての $('#ok-button') に別のクリック イベントがバインドされることを意味します。

キーダウンとキープレスを使用するとすぐに閉じる理由は、ポップアップが開いた瞬間にボタンにフォーカスを設定したためです。

2 つのキー イベントの動作は異なります (キー プロセス中のわずかに異なるタイミングで発生します)。keydown を使用すると、実際のアクション (キーボードのボタンを押す) の途中でフォーカスを変更しているように見えます。

フォーカスを削除すると、別のクリック イベントをバインドしなくなるため、奇妙なダブル トリガー動作が停止します。

クリックイベントを変更することをお勧めします：

$('#ok-button').live('click', function(){
    $('#popup').remove();
}); 
var Popup = function(){
    // Whatever               
};

また、ライブを使用する代わりに、 jQuery の on イベントを確認することをお勧めします。

于 2012-10-01T03:26:21.330 に答える