jQuery Mask PluginA jQuery Plugin to make masks on form fields and HTML elements.
Documentation, Demos & Usage Exampleshttps://igorescobar.github.io/jQuery-Mask-Plugin/
FeaturesLightweight (~2kb minified, ~1kb gziped). Built-in support for dynamically added elements. Masks on any HTML element (no need to server-side mask anymore!)! HTML notation support (data-mask, data-mask-recursive, data-mask-clearifnotmatch). String/Numeric/Alpha/Mixed masks. Reverse mask support for masks on numeric fields. Sanitization. Optional digits. Recursive Digits. Fallback Digits. Advanced mask initialization. Advanced Callbacks. On-the-fly mask change. Mask removal. Full customization. Compatibility with React/UMD/Zepto.js/Angular.JS. HTML5 placeholder support. Clear the field if it not matches support.
Want to buy me a beer? :hearteyes:http://paypal.me/igorcescobar
Install it via Package Managers
bower install jquery-mask-plugin
npm i jquery-mask-plugin
meteor add igorescobar:jquery-mask-plugin
composer require igorescobar/jquery-mask-plugin
gem 'jquery_mask_rails' # more details at http://bit.ly/jquery-mask-gem
EnglishMasks with jQuery Mask Plugin Using jQuery Mask Plugin With Zepto.js
Fun (or not) factsI’ve had the chance to troll Donald Trump. But I didn’t.
CompatibilityjQuery Mask Plugin has been tested with jQuery 1.7+ on all major browsers:
Firefox 2+ (Win, Mac, Linux); IE7+ (Win); Chrome 6+ (Win, Mac, Linux, Android, iPhone); Safari 3.2+ (Win, Mac, iPhone); Opera 8+ (Win, Mac, Linux, Android, iPhone). Android Default Browser v4+
Typescript supportDefinition can be found here.
To install, open terminal and navigate to your working directory.
Typescript 1.x usersInstall typings by running
npm install typings --global. Then install the definition by running
typings install dt~jquery-mask-plugin --global --save.
Typescript 2.x usersUse npm
npm install --save-dev @types/jquery-mask-plugin.
For configuration options and troubleshooting refer to these repositories:
Problems or Questions?Before opening a new issue take a look on those frequently asked questions:
How to integrate with React.js?
How to integrate with Angular.js?
How to integrate with Vue.js?
Problems with old versions of Android keyboard
Negative numbers, or currency related problems
Prefix or sufix on the Mask
Field type number, email not working?
Want to keep the placeholder as the user types?
Bugs?Did you read our docs? Yes? Cool! So now... make sure that you have a functional jsfiddle exemplifying your problem and open an issue for us. Don't know how to do it? Use this fiddle example.
ContributingBug Reporting: Yes! You can contribute opening issues! Documenting: Do you think that something in our docs should be better? Do you have a cool idea to increase the awesomeness? Summit your pull request with your idea! Bug Fixing: No time to lose? Fix it and help others! Write some tests to make sure that everything are working propertly. Improving: Open an issue and lets discuss it. Just to make sure that you're on the right track. Sharing: Yes! Have we saved some of your time? Are you enjoying our mask plugin? Sharing is caring! Tweet it! Facebook it! Linkedin It(?!) :D Donating: Hey, now that you don't need to worry about masks again... buy me a coffee, beer or a PlayStation 4 (Xbox One also accepted!) :o)
Unit TestsWe use QUnit and GruntJS. To run our test suit is just run: ``
in your console or you can open those`
files inside of our`
In case you're familiar with Docker here is how you can use it:
docker build -t jquery-mask . CONTAINER_ID=$(docker run -d -v $PWD:/app/jquery-mask-plugin jquery-mask) docker exec $CONTAINER_ID sh -c "npm install" docker exec -it $CONTAINER_ID /bin/bash grunt test