Posted By

mattvbiggs on 01/29/13


Tagged

jquery textarea textBox


Versions (?)

Who likes this?

3 people have marked this snippet as a favorite

Abiotic
maXXis
Priestd09


jQuery: Dynamic Character Count


 / Published in: jQuery
 

Handy code snippet for keeping track of the number of characters a user is entering into a textbox or textarea. It will dynamically update the count as the user is typing. This also works with copy & paste.

The top snippet will automatically calculate the current count after the page loads; use the .keyup event to do the dynamic update.

All of this code should be in the $(document).ready.

  1. var maxchar = 1500;
  2. var count = $('#txtDescription').val().length;
  3. var char = maxchar - count;
  4. $('#charleft').text(char + " characters left");
  5.  
  6. $('#txtDescription').keyup(function () {
  7. var len = $(this).val().length;
  8. if (len >= maxchar) {
  9. $('#charleft').text("You have reached the character limit!");
  10. } else {
  11. var chardiff = maxchar - len;
  12. $('#charleft').text(chardiff + " characters left");
  13. }
  14. });

Report this snippet  

You need to login to post a comment.