Author: | romulobrasil |
---|---|
Views Total: | 287 views |
Official Page: | Go to website |
Last Update: | January 9, 2023 |
License: | MIT |
Preview:

Description:
PureMask.js is a lightweight, blazing-fast, and easy-to-use input mask library for form fields. Written in vanilla JavaScript and works with no 3rd-party libraries.
It can be helpful in improving the user experience by guiding the user as they enter data, for example, credit card numbers, phone numbers, dates/times, and other types of data that have a specific format.
How to use it:
1. Download and insert the PureMask.js library into your document.
<script src="puremask.min.js"></script>
2. Call the function PureMask.format on the target form fields and pass in a string that represents the mask you want to use as follows:
<input type="text" class="mask data-com-hora" data-mask="##/##/#### ##:##"> <input type="text" class="mask data" data-mask="##/##/####"> <input type="text" class="mask tempo" data-mask="##:##:##"> <input type="text" class="mask tempo-com-siglas" data-mask="##h##m"> <input type="text" class="mask CEP" data-mask="#####-###"> <input type="text" class="mask telefone-DDD" data-mask="(##) ####-####"> <input type="text" class="mask CPF" data-mask="###.###.###-##"> <input type="text" class="mask CNPJ" data-mask="##.###.###/####-##"> <input type="text" class="mask dinheiro" data-mask="###.###.###.###.###.###,##"> <input type="text" class="mask mixed" data-mask="NNNN ###-###"> <input type="text" class="mask placa-carro" data-mask="AAA ####"> <input type="text" class="mask placa-carro-novo" data-mask="AAA#A##">
PureMask.format('.mask');
3. Determine whether to enable input placeholder.
PureMask.format('.mask', true);
Changelog:
01/09/2022
- cleanup