Today i am going to show you how to set the character limit to textarea or input box, the jquery providing a character limit plugin for that you can download it from jquery website. it is very easy to set the limit using
.limit('integer','give any selector to display the count') method having two parameters.
HTML
take the textarea or inputbox box and give the ID or classname one span tag or paragraph tag to display the character count,
<textarea name="count" cols="" rows="" class="countbox"></textarea> <span class="showcount"></span> character left.
Javascript
include the jquery library along with jquery limit plugin inside the head tag. now add the .limit() method
Selector .countbox the limit method has two parameters first one is limit integer and second is the display the count you can give any tag selector here.
<script type="text/javascript" src="jquery-1.10.2.min.js"></script> <script type="text/javascript" src="jquery.limit-1.2.source.js"></script> <script> $(function(){ $('.countbox').limit('50','.showcount'); }); </script>
CSS
<style> .countbox{width:500px;height:50px;padding:5px;border:solid #999 1px;resize:none;} .showcount{ font-size:10px;} </style>
Live Demo
No comments :
Post a Comment