Question

I’m trying to write a simple remaining chars counter for my backoffice input texts with jQuery but it doesn’t work:

<script type="text/javascript">
$(document).ready(function(){

function text_counter (input_text, target) {
    var max = $(input_text).attr("maxlength");
    $(input_text).keydown (function () {
        var timer = setTimeout (function () {
            var text = $(input_text).text();
            var current = text.length;
            $(target).text(current + "/" + max);
        }, 1);
    });
}               
text_counter ("#description", "#description_counter");

});
</script>

<input id="description" type="text" maxlength="250" value="Default text">
<span id="description_counter"></span>

If I start to write inside the input, the span element change in 12/250 and freeze here (12 == “Default text”.length).

Where I’m wrong?

Answer 1

try using val() instead of text()

var text = $(input_text).val();