2015-12-21 10 views
8

ユーザーが数値データのみを入力できるテキストボックスがあります。jQueryのキー入力イベントがユーザーの入力に遅れます

$('#ssn').keyup(function() { 
    var val = this.value.replace(/\D/g, ''); 
    this.value = val; 
}); 

私はに実行している問題は、制限されたキーにユーザーキーアップは、一瞬の文字が​​表示さは、それがで置き換えられています前に、タイムラグがある:私は、テキストボックスのkeyUpイベントに次の関数を使用しています空の文字列キーを押し続けると、キーが離されるまで文字列がボックスに表示されます。この現象を防ぐ方法はありますか? keydownやkeypressのような別のキーボードイベントを試してみましたが、それ以上の動作をしていないようです。ここ は、問題のフィドルです:答え

よりもむしろkeyupイベントを聴くに私のコメントを変換https://jsfiddle.net/oxpy96g9/

+0

'遅れは' 'keyuとして避けられませんキーが離されて値が入力フィールドに追加されるまで、「p」イベントは発生しません。 –

+0

1.スローダウンはjQuery によって導入されました。2.反復変数宣言 によって減速が導入されました。3. JavaScript Regexマシン の起動により減速が導入されます。4.ユーザーがキーを離した後にコードが実行されます。減速。まったく、あなたは混乱を書きました。 –

+3

代わりに 'input'イベントを聞いてみてください。' $( '#ssn')。on( 'input'、function(){...}); ' –

答えて

9

、イベントは値が変更されたときではなく、解雇されるようにinput eventに耳を傾けますキーが離されたとき:

Updated Example

$('#numbers').on('input', function() { 
    this.value = this.value.replace(/\D/g, ''); 
}); 
+0

を試してみることはできません!すごい仕事! – brandelizer

+0

ああ待ってください。私はjsfiddleでこれを試しましたが、明らかに遅れていたので、チェックして編集した後、「実行」ボタンをクリックしても処理されませんでした:D – nicael

+0

魅力的なように働いてくれて、ありがとう。 – noclist

関連する問題