Membuat Text Counter / Limiter JQuery

Saya share snippet sederhana untuk membuat limiter text dengan menggunakan jQuery. Untuk demo klik tombol "Live Demo" di sebelah kanan :)

Atau klik link ini:

(function($) {
    $.fn.extend( {
        limiter: function(limit, elem) {
            $(this).on("keyup focus", function() {
                setCount(this, elem);
            function setCount(src, elem) {
                var chars = src.value.length;
                if (chars > limit) {
                    src.value = src.value.substr(0, limit);
                    chars = limit;
                elem.html( limit - chars );
            setCount($(this)[0], elem);
var elem = $("#chars");
$("#text").limiter(100, elem);



<textarea id="text" maxlength="100" cols="50" rows="5" placeholder="Enter Text"></textarea>
<div id="chars">asa</div>

About Author

Cecep Yusuf

Hi, my name is Cecep Yusuf. However, in the virtual world I am more likely to use the name Cheyuz, which is an abbreviation of two words "Cecep" and "Yusuf". I am founder of, u can view more of me in

Comment & Discussions

  • Cecep Yusuf
    Ada di sini gan:

  • sofyan waldy
    lihat hasil scriptnya gimana ya gan?

  • Please LOGIN before if you want to give the comment.