Use JQuery to calculate the number of input texts in the input and textarea codes. jquerytextarea

Use JQuery to calculate the number of input texts in the input and textarea codes. jquerytextarea

This article mainly introduces jQuery's method for counting the number of input texts. For more information, see.

HTML section:

<Input type = "text" value = "I am the input text" maxlength = "10" id = "detail1"/> <p> <span id = "detail1_num"> 0 </span>/<span> 10 </span> </p> <textarea placeholder = "enter up to 100 words" rows = "3" maxlength = "100" class =" editDetail "id =" detail2 "> Haha </textarea> <p> <span id =" detail2_num "> 0 </span>/<span> 100 </span> </ p>

JS section:

1 $ (function () {2/* input words */3/* The number of words in the input box is displayed first when the page is loaded */4 var text1 = $ ("# detail1 "). val (); 5 var counter1 = text1.length; 6 $ ("# detail1_num "). text (counter1); 7/* Add a trigger event for dynamic calculation of the number of words in the input box */8 $ ("# detail1 "). on ('blur keyup input', function () {9 var text = $ ("# detail1 "). val (); 10 var counter = text. length; 11 $ ("# detail1_num "). text (counter); 12}); 13/* textarea words */14 var text2 = $ ("# detail2 "). val (); 15 var counter2 = text2.length; 16 $ ("# detail2_num "). text (counter2); 17 $ ("# detail2 "). on ('blur keyup input', function () {18 var text = $ ("# detail2 "). val (); 19 var counter = text. length; 20 $ ("# detail2_num "). text (counter); 21}); 22 });

As follows:

As the blogger is mainly engaged in mobile development, the input box will appear in the input text at the beginning of the mobile testing, and the input text in the input box will be incorrect during computing, therefore, an input event is added, which is calculated by the input side in the input box (mainly after entering the Chinese character ).

I hope to help you.

 

 

The article is original. For reposted content, please mark the address of this article as a link. Thank you.