Телефонная маска для формы HTML

Телефонная маска для формы на сайте HTML
Есть много способов для добавления телефонной маски в вашу контактную форму на сайт. Я напишу про самый простой для самого простого сайта на HTML.

<input placeholder="Ваш телефон*" class="phone_mask">
<script src="https://unpkg.com/imask"></script>
<script>
var elements = document.getElementsByClassName('phone_mask');
for (var i = 0; i < elements.length; i++) {
  new IMask(elements[i], {
    mask: '{0}(000)000-00-00',
  });
}
</script>
  • Все скрипты я добавляю в конце страницы перед закрывающимся тегом body.
  • В качестве класса в поле и в скрипте указывается имя phone_mask. Это имя можно изменить на любое другое.
  • Маску тоже можно корректировать. Например, в начале поставить “+7”, если вы планируете использовать маску по России. “0” в маске обозначает пустой символ.
  • Исходник скрипта можно скачать здесь: Github. Здесь можно посмотреть другие маски от автора.

Читайте также:

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *