Looking to build a Twitter-like textarea character countdown to show your users how much space they have remaining?
Good. See below.
I’ve seen a few tutorials online but they seem to make it more complex than it needs to be. Just a few lines of jQuery does the trick.
1. Set a variable for the max number of characters:
var maxLength = 100;
2. Use the keyup event on the textarea, which fires each time a key is pressed when the textarea is in focus. Ideal:
3. Check the value and get the length of it, store it in a variable:
var length = $(this).val().length;
4. Take that value away from your max width:
var length = maxLength-length;
5. Put the result somewhere on the page: