Блог

Главная - Вопросы по программированию - html / jquery .mask, организующий номер телефона

html / jquery .mask, организующий номер телефона

#jquery #mask

#jquery #маска

Вопрос:

я использую:

 <script src="jquery.js" type="text/javascript"></script>
<script src="jquery.maskedinput.js" type="text/javascript"></script>
<script>
jQuery(function($){
$("#phone").mask("(999) 999-9999? x99999", {placeholder:" "});
});
</script>

Я не знаю, пропускаю ли я что-то простое или что, или, может быть, я неправильно использовал html:

 Phone number: <input type="text" id="phone" name="phoneNumber"/>

Моя цель — сделать его похожим на (999) 999-9999 со скрытым ext. 999, если он им не нужен. но весь скрипт не работает и вообще ничего не делает.

Комментарии:

1. Что вы имеете в виду под «скрытым доб. 999»? если пользователь вводит только 7 цифр, скрыть часть (999)?

2. как будто им нужно ввести только 7 цифр, это не заставляет их вводить и расширять, если они им не нужны

Ответ №1:

Вам не нужен раздел-заполнитель.

Просто добавьте

 $("#phone").mask("(999) 999-9999? x99999");

Редактировать

Проверьте этот jsfiddle

Комментарии:

1. Какую версию maskedinput вы используете? Ознакомьтесь с разделом РЕДАКТИРОВАНИЯ (добавлен jsfiddle)

2. я получил код от digitalbush.com/projects/masked-input-plugin/#demo ооочень, что бы там ни использовалось …. хорошо, возможно, я полностью упустил это из виду, но я никогда не использовал jquery, вы должны загружать что-то вместе с этим кодом?

3. да, так оно и было. это было совершенно глупо с моей стороны. спасибо, что наставили меня на правильный путь

Ответ №2:

 document.getElementById('kisicep_telefonu').addEventListener('input', function(e) {
  var x = e.target.value.replace(/D/g, '').match(/(d{0,3})(d{0,3})(d{0,4})/);
  e.target.value = !x[2] ? x[1] : '('   x[1]   ') '   x[2]   (x[3] ? '-'   x[3] : '');
});  
 <div class="form-group form-material col-md-6" data-plugin="formMaterial">
  <label class="form-control-label" for="kisicep_telefonu">Cep Telefonunuz</label>
  <span class="required" style="color:red">*</span>
  <input type="text" class="form-control" id="kisicep_telefonu" name="kisicep_telefonu" autocomplete="off" value="" placeholder="(000) 000-0000 ">
</div>