Javascript/JQuery：アラートボックスで2回トリガしないkeypress/blurイベントを追加する方法は？ IEのみ

Question

ユーザーが入力またはクリックしたときに検証したい入力フィールドがあります。このためには、イベントkeypressとblurを使用します。入力が検証に失敗すると、アラートボックスが呼び出されます。

IE（すべてのバージョン）で、無効な入力でEnterキーを押すと、何らかの理由でkeypressとblurの両方のイベントが発生していることがわかりました（私は警告ボックスだと思っていますが、FF/Chrome）、同じアラートボックスの2つが表示されます。どうすれば1つしか表示されないのですか？

EDIT：FF/Chromeでは、入力で検証しようとした後にどこかをクリックすると、2番目の警告ボックスが表示されていました。

簡体コード：

$("#input-field").keypress(function(event) { 
    if (event.keycode == 13) { 
     event.stopPropagation(); 
     validate(); 
     return false; 
    } 
}); 

$("#input-field").blur(function() { 
    validate(); 
}); 

function validate() { 
    if ($("#input-field").val() == '') { 
     alert("Invalid input"); 
    } 
} 

EDIT：AH-HA。実際には修正されていませんが、私が忘れてしまった詳細は分かりません。無効な入力を以前の有効な値に復元する必要があるため、validate関数が再び値をチェックすると2回失敗しません。

Answer 1

Firefoxはkeypressイベント権利を取得しません。これらのイベントは、文字を生成するキーコンビネーションが押された場合にのみトリガされます（これは、任意のキーを押すのと同じではありません）。

代わりに​​を使用してください（これはおそらく、IEが正しく処理する唯一のイベントです - MSはそれを "発明した"ので;-)）。

http://www.quirksmode.org/dom/events/keys.htmlを参照してください。

Answer 2

IEのUserAgentをチェックし、IEのkeypressイベントをスキップしました（キー入力とぼかしを以下の同じ機能にバインドします）。直接的または素晴らしい解決策ではなく、悲劇的な解決策ではありませんが、同じ問題を無駄に解決しようとしています。参考になるかもしれないマイナーノート：jQueryはどれを正規化しますか？キー押下で確実にe.which == 13を使用できます。私はまた、関数を1つのバインドに結合します。

$("#input-field").bind('blur keypress', function(e) { 
    if(e.which == 13) { 
     // keypress code (e.g. check for IE and return if so) 
    } 
    validate(); 
}); 

私はグローバルを設定し、（あなたのケースで）検証がすでに要素にトリガされたかどうかを示すために、任意のフラグを割り当てるために）（jQueryのデータを使用してみましたが、イベントは同時に、または少なくともトリガ、もし連続して、十分に速く、オープニングラインが真実にいくらかの旗をセットしても、そのトリックをしなかった。私は、小さなコールバックの遅延を入れることが助けになるかもしれないが、それは汚れていると私はそれをテストしていないので、回避策としてもそれをしないことを読むだろう。 stopPropagation（）とpreventDefault（）も役に立ちませんでした。