2012-04-25 19 views
4

入力コントロール内のテキストが変更されたときは、すぐにいくつかのものを更新する必要があります。しかし、私はこれに対して正しい事象を見つけることができないようです。テキスト入力コントロールの任意のテキスト変更に対する正しいjavascriptイベントは何ですか?

  • 入力ボックスを離したとき(タブを外したとき、または外に出たとき)にのみonchangeが発生します。

  • れるonkeypress火災前に変更がなされ、それがどのキーを押し上発射(例えば、任意のテキストの変更が発生することはありません&左右のカーソル)

  • onKeyDownメソッドをしても、上火onkeyupのを(任意のテキストの変更が発生することはありません。でも、Shiftキーなどのような、)任意のキー

はまた、これらのどれもマウスでクリップボードから右クリック+貼り付けたときを発射するように見えるん。または、JS内から値を変更する場合(つまり、input.value = somethingを他の場所から行う場合)

最小例:http://jsfiddle.net/nggAm/

私は何をすべき?私はこれを回避する方法の1つは、すべてのイベントを1つの汎用イベントハンドラに設定し、そこに値をキャッシュし、文字列が変更されたときにのみ実際の更新を行うことだと思います。しかし、これはちょっと嘘つきです。 は何ですか?これを行う方法はですか?

+0

oninput残念ながら、[変異イベント](https://developer.mozilla.org/en/DOM/Mutation_events)どちらもクロスブラウザにもお勧めです。 –

答えて

1

古いブラウザの場合、doは入力のonkeyupとonchangeとonpasteを設定する必要があります。

しかし、より新しいブラウザには、すべてのブラウザが望むものであるoninputがあります。

すべてのイベントを設定し、oninput以外のすべてを削除できます(オン入力が発生した場合)。

(しかし、IE9は、あなたが文字をバックスペースまたは削除されている場合は入力イベントを渡すに問題を持っているので、ちょうどそのブラウザ用のキーイベントを残す。)

サンプルコード指向1つのハンドラにすべてのイベントを、あれば削除火災

F.text1.oninput= function(){ 
    F.text1.onpaste= F.text1.onchange= null; 
    if(!document.documentMode) F.text1.onkeyup= null; 
    F.text1.oninput= F.limiter; 
    return F.limiter(); 
} 
F.text1.onpaste= function(){ 
    setTimeout(F.limiter, 100); 
} 
F.text1.onkeyup= F.text1.onchange= F.limiter; 
関連する問題