How to make Word Counter Tool in HTML and jQuery

How to make Word Counter Tool in HTML and jQuery
How to make Word Counter Tool in HTML and jQuery

I am implement word counter tool in HTML page. I’m using jQuery Plugin and textarea. It very simple word counter tool. Don’t need internet connection. Please download zip file and implement your form.

HTML PAGE
<html>
<head>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jQuery.textareaCounter.min.js"></script>
</head>

<body>
    <textarea rows="15" cols="50"></textarea>

    <script type="text/javascript">
    $("textarea").textareaCounter();
    </script>

</body>
</html>

jQuery textareaCounter min js

(function(a){a.fn.textareaCounter=function(b){var c={limit:160};
var b=a.extend(c,b);
return this.each(function(){var c,d,e,f;
c=a(this);
c.after('<span style="font-size: 11px; clear: both; margin-top: 3px; display: block;" id="counter-text">Max. '+b.limit+" words</span>");
c.keyup(function(){d=c.val();
if(d===""){e=0}else{e=a.trim(d).split(" ").length}if(e>b.limit){a("#counter-text").html('<span style="color: #DD0000;">0 words left</span>');
f=a.trim(d).split(" ",b.limit);f=f.join(" ");
a(this).val(f)}else{a("#counter-text").html(b.limit-e+" words left")}})})}})
(jQuery)

The default limits to 160 words but you can change that to whatever you like.

(function(a){a.fn.textareaCounter=function(b){var c={limit:160};

Download Code