Сегодня познакомлю с интересной библиотекой maskedinput.js. Если посмотреть на гите, то можно заметить - библиотека не из свежих, но достойных альтернатив маловато. Сам файл плагина весит всего 4кб, подрубается всего 1 строкой JS кода, а зато сколько всего умеет. Сейчас все расскажу.
Устанавливаем
📎Качаем модуль с Гугл диска или с GitHub.
🪓Подрубаем его перед </body> :
Не забудьте подключить jQuery!
p.s. дико неудобно что на дзене нет поддержки кода, приходится все заливать на gist 😕
Используем
🪓Вставляем в файл скриптов, либо в HTML сайта через <script>...</script> эту кодулю:
Здесь мы указали: класс поля .phonemask, к которому будем прикручивать маску для телефона, и собственно саму маску +7 (999) 999 99-99 которая любую вводимую в поле информацию будет приводить к этому виду.
🪓И дописываем этот класс к нашему полю:
<input type="text" name="phone" class="phonemask">
Другие маски
Помимо масок для номеров телефона, плагин позволяет сделать маски:
🗓Для даты
$(".datemask").mask("99/99/9999");
💳Для номера карты
$(".cardmask").mask("9999-9999-9999-9999");
🔢И даже для обычных чисел
$(".numbermask").mask("0.9?9");
Подписаться на @wjourn 🔥