Limit The Number Of Digits In Input - jQuery maxlength.js

File Size: 9.41 KB
Views Total: 888
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Limit The Number Of Digits In Input - jQuery maxlength.js

maxlength.js is a feature-rich jQuery plugin that limits the number of digits and auto-formats numeric values in input fields. Can be helpful in ensuring data integrity and minimizing input errors.


  • Restrict the number of digits allowed in input fields.
  • Format numbers with thousand separators and rounded fractional digits automatically.
  • Apply custom colors to negative number inputs.
  • And more.

How to use it:

1. Include the minified version of the maxlength.js plugin after jQuery.

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/jquery.maxlength.min.js"></script>

2. To initialize the plugin, simply add the data-max-length to the input field.

<!-- Only positive numbers are allowed -->
<!-- Maximum number of digits: 10 -->
<!-- Maximum decimal places: 2 -->
<input data-max-length="+10.2" />
<!-- Positive and negative numbers are allowed -->
<!-- Maximum number of digits: 5 -->
<!-- Maximum decimal places: 1 -->
<input data-max-length="-5.1" />

3. More HTML5 data attributes to customize the plugin.

  • data-disable-autofill: Disable fractional autofill.
  • data-disable-auto-comma: Disable comma autofill.
  • data-disable-smart-minus: Disable smart minus configuration.
  • data-disable-init-refresh: Disable the initial refresh.
  • data-enable-highlight-minus: Enable highlighting of negative values in either default red or the assigned hexadecimal color.
  • data-horizontal-align: 'Left', 'Center', or 'Right'(Default).

4. It also allows you to sum numbers of multiple input fields.

<input type="text" class="sumTarget" data-max-length="-5.2">
<input type="text" class="sumTarget" data-max-length="-5.2">
<input type="text" data-sum="input.sumTarget" data-max-length="-6.2">


v1.7.2 (2024-02-19)

  • Minor optimization.

v1.7.1 (2024-02-14)

  • Maintain cursor position when focusing on an input element and then starting to select its characters in a single mouse click action.

v1.7.0 (2024-02-10)

  • Major optimization, initialization execution efficiency is greatly increased.
  • Maintain cursor position when focus on an input element.
  • Maintain same globalization option in initialization process.

v1.6.4 (2024-01-29)

  • Minor optimization.


  • Add support for jQuery's no Conflict mode. 


  • Change NumberUtil() to an extended object of jQuery: $.NumberUtil.


  • Remove unused exports of the internal util.


  • Bugfix

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