jQuery Simple Text Counter is a jQuery plug-in that adds a customizable character count calculator to text boxes such as textarea and input field. It can be used to count and count the number of characters typed into a text field, preventing typing when the limit is exceeded.
text field character counter, textarea remaining character count javascript, textarea character count javascript, limit character input in the textarea including count
How to make use of it:
1. Download and import the jquery-simple-txt-counter.js within the doc.
<script src="/path/to/cdn/jquery.slim.min.js"></script> <script src="/path/to/jquery-simple-txt-counter.js"></script>
2. Call the function simpleTxtCounter on the text field and specify the utmost variety of characters allowed.
<textarea> webcodeflow.com </textarea> <input type="text" />
$('input, textarea').simpleTxtCounter({
maxLength: 140,
});3. Define the count text.
$('input, textarea').simpleTxtCounter({
maxLength: 140,
countText: 'Max',
});4. Customize the HTML template of the character counter.
$('input, textarea').simpleTxtCounter({
maxLength: 140,
countElem: '<div class="form-text"></div>',
});5. Determine whether or not to permit linebreak within the text field.
$('input, textarea').simpleTxtCounter({
maxLength: 140,
lineBreak: false,
});Options
| Option | Default | Description |
|---|---|---|
| after | undefined | selector to after inserting the counter element |
| maxLength | undefined | Maximum size (maxlength attribute is used if it exists) |
| countText | undefined | Pre text before counter |
| countElem | <div/> | Counter element |
| lineBreak | true | If false, it does not allow line breakage |
Add A Character Count To Text Field, jQuery Simple Text Counter Plugin/Github, textarea character limit javascript textbox character counter jquery, jquery count characters in input
See Demo And Download
Official Website(hugosbg): Click Here
This superior jQuery/javascript plugin is developed by hugosbg. For extra Advanced Usages, please go to the official website.