0

jQuery(function($) {
  $("#tel").mask("+38(999) 999-9999");
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.maskedinput/1.4.1/jquery.maskedinput.js"></script>
<form>
  <input type="text" id="tel" name="phone" placeholder="Номер телефона" required style="width:100%;position:relative;margin-bottom:0;height:50px;border-radius:8px;border-color:white;margin-bottom:10px;margin-top:10px;padding-left:10px;border-style:solid;border-width:2px;"
  />
  <input type="text" id="tel" name="phone" placeholder="Номер телефона" required style="width:100%;position:relative;margin-bottom:0;height:50px;border-radius:8px;border-color:white;margin-bottom:10px;margin-top:10px;padding-left:10px;border-style:solid;border-width:2px;"
  />
</form>

2 ответа 2

3

Работает, но только на первом инпуте. Потому что Вы допустили грубейшую ошибку - два одинаковых id.

Если нужна одна маска на оба инпута, повесьте её на селектор по атрибуту:

$('[name="phone"]').mask("+38(999) 999-9999");
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.maskedinput/1.4.1/jquery.maskedinput.js"></script>
<form>
<input type="text" name="phone" placeholder="Номер телефона" required style="width:100%;position:relative;margin-bottom:0;height:50px;border-radius:8px;border-color:white;margin-bottom:10px;margin-top:10px;padding-left:10px;border-style:solid;border-width:2px;" />
<input type="text" name="phone" placeholder="Номер телефона" required style="width:100%;position:relative;margin-bottom:0;height:50px;border-radius:8px;border-color:white;margin-bottom:10px;margin-top:10px;padding-left:10px;border-style:solid;border-width:2px;" />
</form>

2
  • Подскажите, как можно на мобильной версии чтобы открывалась именно цифровая клавиатура
    – Oleksandr
    3 апр 2019 в 14:21
  • 2
    @Alexander, попробуйте сменить type="text" на type="tel" - возможно, на телефонах это приведёт к открытию цифровой клавиатуры 3 апр 2019 в 14:29
2

В двух input поменяйте id="tel" на class="tel".

И в JS коде поменяйте $("#tel").mask("+38(999) 999-9999"); на $(".tel").mask("+38(999) 999-9999");

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.