Кастомизация поля для ввода телефона
Кастомизация поля для ввода телефона весьма интересная штука для улучшения понимания того, что требуется пользователю ввести в поле для телефона. Это может быть как набор определенных цифр, так и определенный порядок этих цифр. Для того, чтобы сделать себе отличное поле для ввода пользователями телефона надо воспользоваться одним очень хорошим плагином, который работает на jQuery. Это плагин — Masked Input Plugin. Скачать можно здесь.
Что делает этот замечательный плагин. Он собственно внедряется в наш input, где мы запрашивает ввод телефона и показывает пользователю, что мы от него хотим получить. Например, вот такой набор +7 (906) 272-38-19, или иной набор символов. Это кстати, мой личный номер телефона для тех, кто хотел бы заказать у меня сайт. Ну это я так… к слову :).
Использование плагина Masked Input Plugin
Использовать плагин будем следующим образом.
1. Сначала подключаем его в <head> нашего сайта. Перед закрывающим тегом </head> пишем следующее:
<script src="jquery.maskedinput.js" type="text/javascript"></script>
Обратите внимание на пути к Вашему файла скрипта и убедитесь, что подключили jQuery.
Далее, используем селекторы для доступа к нужным нам инпутам и даем им маску, пример вот.
jQuery(function($){
$("#date").mask("99/99/9999",{placeholder:"mm/dd/yyyy"});
$("#phone").mask("(999) 999-9999");
$("#tin").mask("99-9999999");
$("#ssn").mask("999-99-9999");
});
Обратите внимание, что данный код надо располагать либо в файле скриптов, если у Вас он есть, либо, заключим в теги <script></script> поместить код перед закрывающим тегом </body>. Цифры в коде означают то, что можно вводить только цифры.
P.S. Иногда, так получается, что нужно получить доступ к input, который имеет тока определенный name. Тогда пишем код так.
jQuery(function($){
$("input[name='phone']").mask("(999) 999-9999");
});
Если есть вопросы, задавайте их в форме ниже. Спасибо.
Свяжитесь с нами уже сейчас
- +7 (906) 272-38-19
Telegram / WhatsApp - info@cruelten.ru
- Cruelten
- Cruelten
Вы привыкли видеть здесь форму обратной связи. Ведь так? Ее делают почти все. Но исследуя поведение людей, мы пришли к выводу, что форма совершенно не нужна. В любом случае все сводится к обсуждению Вашего проекта в WhatsApp или Telegram. А зачем нам тратить Ваше время на заполнение различных форм? Поэтому, пишите в Telegram или в WhatsApp.
