Маска введення номера телефону

Доброї доби 🙂

За умовчанням, на цій плагіні маски немає, тому що його купують з різних країн, також деяким він потрібен для введення міських номерів тощо. За бажанням замовників часто встановлюю маску введення номера, якщо вони хочуть впорядкувати введення номера і задати певний стандарт.

Виглядає це приблизно так:

Щоб встановити маску номера, потрібно підключити кілька скриптів. Почнемо мабуть із підключення бібліотекиjQuery. У шапку сайту перед закриваєтьсяhead або в підвал перед закриваєтьсяbody додайте ось такий рядок коду:

Якщо Ви вже підключали або це зроблено до вас і у Вашому коді є схожий рядок, можливо, з іншою версією, то робити це повторно не слід.

Далі Вам потрібно завантажити файл maskinput.js, усередині якого плагін для обробки маски. Потім залити собі на сайт, наприклад, у папкуjs і підключаємо після бібліотеки jquery. Вийде це приблизно так:

Далі, ми додаємо останній зі скриптів, який і створить вигляд нашої маски, тобто те, що буде видно всередині форми введення. Після бібліотеки та плагіна додаємо такий код:

Як бачите ми задали маску і тепер людина в полі введення побачить такий вид -+380(___) ___-____. Плагін маски влаштований так, що всі дев'ятки -9 змінює на нижній прочерк -_.

Є момент. Якщо вам у коді потрібно задати дев'ятку, щоб її було видно, у Вас проблема 🙂 її замінить прочерком тобто вийде, якщо вам треба так 95(__)____ у вас вийде так _5(__)____ Як вирішити це питання я поки що не знайшов.

Перед маскою вказується:ID у цьому прикладі це#tel. Тобто до поля введенняinput у якого такий айді буде застосована маска.

Поле введення буде звичайним, головне правильно вказати айді.

Завдякиplaceholder спочатку в полі буде текст, а при натисканні на ньому з'явиться маска. можете маску ввести відразу, тоді вона буде там і там.

Ось, власне, і вся маска. Також хочу додати, що можна вказувати різні маски одночасно для різних полів введення, наприклад:

+38(___) ___-____ __/__/____ ____-____-____

Ці приклади всі стосувалися цифрових вводів, але є ще й інші.