1

Суть вопроса заключается в работе с плагином, и русском номере телефоне.

Я использую этот плагин: jQuery mask plugin

У меня настроена на инпут след. маска:

$('.PhoneNumber').mask('+7 (000) 000-00-00')

Тоесть маска настроена на международный формат. Бывают слепые пользователи, которые начинают вводить номер телефона с цифры 8, и не видят, что маска в инпуте автоматически подставляется и начинает писать значение с :

+7 (8..)

В результате история заканчивается тем, что слепой пользователь до конца вводит цифры, не смотря на экран, и получается последнюю цифру не вводит, так как маска ее не воспринимает, и мы получаем не верный номер телефона.

Вопрос заключается в том, как можно сделать так, что бы при первом вводе 8рки маска эту цифру не воспринимала, но если пользователь второй раз ввел 8 - то уже воспринимала. Если пользователь вводит любые цифры отличные от 8 то пропускать все символы.

Может кто то работал с плагином и сможет помочь решить вопрос?

3
  • А номер не может действительно начинаться с +7 8.... ? Тогда кто заметил +7 впереди и вводит реальный номер, начинающийся с 8, недопечатает первую 8... Может... к кнопке отправки докрутить проверку первого числа. Если оно совпадает с 8 - не отправить, а красными буквами вывести запрос подтверждения, что номер точно правильный. 12 мая 2019 в 13:58
  • Эта ошибка будет в таком ключе как вы описали только тогда, когда пользователь решит ввесли городской номер, ито случай очень будет редким. Поэтому нужно сделать так как я описал. При первом вводе 8 надо пропустить. если ввели еще раз то уже отобразить
    – WhoIsDT
    12 мая 2019 в 14:03
  • изначально поле ввода пустое. поэтому тот кто начнет с 8 увидет на экране что у него только появилась возможность ввода после нажатия первой 8ки
    – WhoIsDT
    12 мая 2019 в 14:06

1 ответ 1

1

$(...).one запускает функцию только один раз. А .slice() разрезает строку в указанных местах. В данном случае slice(0,1) — это первый символ.

$(document).one('input', '#PhoneNumber', function(){ 
  if( this.value.slice(0,1) == '8' ){
    this.value = this.value.replace(/^8/,'');
  }
});

$(document).on('click', '#send', function(){
  if( $('#PhoneNumber').val().length < 11 /*или какая там длина должна быть...*/){
    alert('Кажется введенный номер слишком короткий!');
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<input id="PhoneNumber">

<button id="send">Отправить</button>

Здесь есть минус - если сотрет и решит еще раз набрать - уже не сработает.

P.s. у меня там #id, а у вас .class, не перепутайте)

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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