Юзабильные формы обратной связи
Опубликовано: 01.09.2018
Наверное перед каждым веб-мастером вставал вопрос, как заставить пользователя вводить информацию (номер телефона, дату и т.д.) в нужном формате, но заставлять пользователя совершенно не нужно — пусть за пользователя основную работу делает ПО.
На помощь приходет замечательный скрипт «Masked Input Plugin», который позволит назначить для каждого поля маску, по которой данные будут заполнятся в полях.
Самодельная форма добавления элемента на API Битрикс
Для начала нам понадобится скрипт « Masked Input Plugin » написанный на jQuery, его размер 2.8 килобайта, содержит всего два файла: jquery.maskedinput.js и jquery.maskedinput.min.js
Первым делом подключаем упамянутые выше два файла, для этого в head прописываем следующий код:
Установка CRM битрикс24 на свой сайт
<script type="text/javascript" src="js/jquery.maskedinput.js" ></script> <script type="text/javascript" src="js/jquery.maskedinput.min.js"></script>
Обратите внимание в src=”js/jquery.maskedinput.js” нужно указать актуальный для вашего сайта путь к файлу jquery.maskedinput.js
Теперь для использования скрипта перед формой нужно вставить следующий код:
<script type="text/javascript"> jQuery(function($){ $("#date").mask("99/99/9999"); $("#phone").mask("(999) 999-9999"); $("#tin").mask("99-9999999"); $("#ssn").mask("999-99-9999"); }); </script>Этот скрипт будет добавлять узнанную маску для форм с id: date, phone, tin, ssn.
Теперь о масках символов:
a — Все алфавитные значения (A-Z,a-z) 9 — Все цифровые значения (0-9) * — Любые алфавитно-цифровые значения (A-Z,a-z,0-9)
Вкратце это все, если вам нужна более подробная информация вы можете найти ее на сайте автора этого скрипта «Masked Input Plugin» .