jQuery Tutorial – 46 – Character Counting Remaining on Textarea

Facebook –
GitHub –
Google+ –
LinkedIn –
reddit –
Support –
thenewboston –
Twitter –






15 responses to “jQuery Tutorial – 46 – Character Counting Remaining on Textarea”

  1. Rasim Agayev Avatar

    Thanks a lot, I've fixed my codes by watching this tutorial

  2. Prakash Besra Avatar

    var total=parseInt($("#textarea").attr("maxLength"));
    $("#textarea").keyup(function () {
    var len=$("#textarea").val().length;
    $("#para").html((total-len)+" characters remaining");

  3. Nishant Jasra Avatar

    its working perfectly fine, only issue got here is…….my characters is going beyond limits, means after 0 charcter remain, i still can type…n remaining characters goes in -1 -2 -3 so on
    how can i put validation over here ??

  4. Tyler Obier Avatar

    var input = $("#message").attr('maxlength');
    var max = input;

    $("#counter").html(max+" characters remaining");
    var text_length = $("#message").val().length;
    var remaining = max – text_length;

    $("#counter").html(remaining + " characters remaining");
    if (remaining <= 0) {
    }); then i added a style to change the color red like so .max{ color: red; }

  5. fuad471 Avatar

    thank you really

  6. Novica Vukobratovic Avatar

    My comment is there to help other people that are not as "experienced" as you. Notice the quotes. Off you go troll

  7. Sultana Ionut Avatar

    Ty with an older version of jquery,for example 1.8.0 🙂

  8. ErichLancaster Avatar

    Doesn't work for me either and i'm using the exact same code as Alex
    (Browser: Google Chrome)

  9. ketchup1001 Avatar

    // returns a string
    var text_max = $('textarea').attr('maxlength'­);

    // more useful if you plan to work with text_max
    var text_max = parseInt($('textarea').attr('maxlength'­));

  10. Novica Vukobratovic Avatar

    Bad thing in this code is the text_max variable,because it is not dynamic.If someone changes a number in maxlength field,the code brakes copmletly.Instead,do this : var text_max = $('textarea').attr('maxlength'); It then takes whatever it is in that field and stores it.If you want to change the number later,code is still valid 🙂

  11. I Heart Noise Avatar

    Some screaming in the background there :-p

  12. FFWDEntertainment Avatar

    @alex, from what ive seen so far youve gotten better at doing these tuts. Keep up the good work

Leave a Reply

Your email address will not be published. Required fields are marked *