2016-12-22 3 views
3

私は次のイベントを検索しています。JavaScriptまたはjQueryの同じテキストボックスの横に自動的に表示されるように、登録画面のテキストボックスに入力された文字数が必要です。テキストボックスに入力された文字数を数え、それを自動的に隣に表示する方法は?

初心者からの質問です。ありがとうございます。

+0

'.keyup()'を検索し、入力の '.val()'の 'length'を取得します。 – guradio

+0

@guradio' .keyup() 'はこれに対して信頼できる関数ではありません。参照してください:http://stackoverflow.com/questions/2823733/textarea-onchange-detection – MasterBob

+1

あなたのリンクの@MasterBobを読んだことがありますか?答えは '.keyup()'を使用しました – guradio

答えて

7

inputイベントをリッスンし、テキストボックスの値の長さを確認します。

$("#input").on("input", function() { 
 
    $("#count").text(this.value.length); 
 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="text" id="input"> <span id="count">0</span>

1

私見では、キーの押下は、文字カウントを探すための理想的なイベントでなければなりません。

$('#input').on('keypress', function(e) { 
    var count = $(this).val().length; 
    $('#span').text(count); 
} 

keyUpイベント 対キー押下私が押すと、数秒間の任意の文字キーを押した場合、それは鍵が解除されたので、あなたにこの1のカウントを与える入力ボックスとからkeyupイベントに数文字を入力したいです1回だけ。しかし、keypressは正確な文字数を入力します。

+1

キーボードではなく*編集*メニューでテキストを編集するとどうなりますか? (また、 'keyup'を使用しないことについてのあなたの説明は、あなたが示したコードがキーが押された/何回押されたのかを数えないので、現在の値の長さを直接テストします。 – nnnnnn

+0

@nnnnnn編集メニューで編集テキストを取得できませんでした。また、私の説明は完全に問題の文脈ではありませんでした。これが間違っていると言う私のやり方かもしれませんが、私が教えたいと思ったのは、キーアップとキー押しとの違いです。 –

関連する問題