jQuery Plugin To Display Remaining Characters In Text Field - charactersRemaining
| File Size: | 4.25 KB |
|---|---|
| Views Total: | 1105 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Just another jQuery plugin that displays how many characters remaining in a text field and enforces max requirement using maxlength attribute.
How to use it:
1. Put jQuery library and the jQuery charactersRemaining plugin at the bottom of the webpage.
<script src="//code.jquery.com/jquery.min.js"></script> <script src="jquery.charactersRemaining.js"></script>
2. Use 'maxlength' attribute to specify the maximum number of characters are allowed typing into your input field and/or textarea.
<textarea maxlength="140"></textarea> <input maxlength="20"></textarea>
3. Calling the function will generate a character counter underneath the input field and textarea.
jQuery('textarea,input').charactersRemaining();
4. The character counter will be wrapped into an inline span element with the css class of 'charRemaining', so that you can apply your custom CSS styles as follows:
.charRemaining { /*...*/ }
5. Specify the text to display in the character counter.
jQuery('textarea,input').charactersRemaining({
singleCharacterText: '## character remaining',
multipleCharacterText: '## characters remaining'
});
This awesome jQuery plugin is developed by bryn500. For more Advanced Usages, please check the demo page or visit the official website.











