Limit Character Length In Text Field - jQuery Ensure Max Length

Ensure Max Length is a super small (1kb minified) and cross-browser jQuery plugin that allows you to specify the character limit for a text field. Supports both textarea and input elements.

Also provides a character counter that displays the character limit and current character count.

How to use it:

1. Insert the minified version of the Ensure Max Length plugin after jQuery.

<script src="https://code.jquery.com/jquery-1.12.4.min.js" 
        integrity="sha384-nvAa0+6Qg9clwYCGGPpDQLVpLNn0fRaROjHqs13t4Ggj3Ez50XnGQqc/r8MhnRDZ" 
        crossorigin="anonymous">
</script>
<script src="dist/jquery-ensure-max-length.min.js"></script>

2. Attach the plugin to a text field and done.

<input type="text" id="demo-1">
<textarea id="demo-2" rows="5"></textarea>

$(function(){

  $( '#demo-1,#demo-2' ).EnsureMaxLength();

});

3. Specify the maximum number of characters allowed to type in the text field. Default: 100.

$(function(){

  $( '#demo-1,#demo-2' ).EnsureMaxLength({
    limit: 140
  });

});

4. Customize the separator for the character counter. Default: /.

$(function(){

  $( '#demo-1,#demo-2' ).EnsureMaxLength({
    separator: ' of '
  });

});

5. Append extra CSS classes to the character counter.

$(function(){

  $( '#demo-1,#demo-2' ).EnsureMaxLength({
    cssClass: 'class-1, class-2'
  });

});

6. Append the character counter to a specific container.

<span id="counter-container"></span>

$(function(){

  $( '#demo-1,#demo-2' ).EnsureMaxLength({
    placement: '#counter-container'
  });

});

Changelog:

2019-04-13

• Fixed Character blinking.

---

This awesome jQuery plugin is developed by vsilva472. For more Advanced Usages, please check the demo page or visit the official website.