1. ホーム
  2. javascript

[解決済み] jQueryで入力変化を検出する?

2022-03-14 19:18:52

質問

jqueryを使用する場合 .change の上に input の場合、イベントは入力がフォーカスを失ったときのみ発生します。

私の場合、入力値が変更されたらすぐにサービスを呼び出す(値が有効かどうかをチェックする)必要があります。どうすればこれを実現できるでしょうか?

どのように解決するのですか?

説明と例のためにUPDATED

の例です。 http://jsfiddle.net/pxfunc/5kpeJ/

方法1. input イベント

モダンブラウザでは input イベントが発生します。 このイベントは、ユーザーがテキストフィールドに入力するとき、ペーストするとき、取り消すとき、基本的にはいつでもある値から別の値に変わったときに発生します。

jQueryではこのようにします。

$('#someInput').bind('input', function() { 
    $(this).val() // get the current value of the input field.
});

jQuery 1.7 以降では、以下のように置き換えます。 bindon :

$('#someInput').on('input', function() { 
    $(this).val() // get the current value of the input field.
});

方法2. keyup イベント

古いブラウザの場合は keyup イベント (これはキーボードのキーが離されると発生します。このイベントは、"w" が離されると入力値が変更されるため、ある種の誤検出をすることがあります。 keyup イベントが発生しますが、"shift" キーが離されたときにも keyup イベントが発生しますが、入力には何の変更も加えられていません)。 また、このメソッドは、ユーザーが右クリックしてコンテキストメニューからペーストした場合にも発生しません。

$('#someInput').keyup(function() {
    $(this).val() // get the current value of the input field.
});

方法3.タイマー( setInterval または setTimeout )

の制限を回避するために keyup の場合、タイマーを設定して定期的に入力の値をチェックし、値の変化を判断することができます。 そのためには setInterval または setTimeout を使えば、このタイマーチェックができます。 このSOの質問でマークされた答えを参照してください。 jQueryテキストボックスの変更イベント を使用した動作例については、フィドルを参照してください。 focusblur イベントを使用して、特定の入力フィールドのタイマーを開始および停止することができます。