Проблема ввода в скобках поля ввода для мобильных телефонов в США и проблема настроек auto da sh

Question

В полях ввода для мобильных устройств в США автоматические скобки и автоматическая установка параметров sh

работа в формате "(XXX) XXX-XXXX"

Фрагмент моего кода:

      $("#contact_no").keyup(function() {
    	     var curchr = this.value.length;
    	     var curval = $(this).val();
    	     if (curchr == 3) {
    	         $(this).val("(" + curval + ")" + " ");
    	     } else if (curchr == 9) {
    	         $(this).val(curval + "-");
    	     }
      });
    </script

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<input type="text" class="form-control" name="contact_no" id="contact_no" placeholder="Contact Number">

   
   

выше код работает хорошо, но когда мы редактируем любую цифру / цифру, возникает двойная скобка и двойная косая черта .

пожалуйста, предложите мне изменения для правильного мобильного формата us-auto (скобки и слеш sh)

Answer 1

Попробуй так думать. Он не завершен, поскольку у него все еще есть проблемы с редактированием, но я верю, что, приложив немного усилий, вы достигнете своей цели.

$("#contact_no").keyup(function() {
  let matches = this.value.match(/\d+/g);
  if (!matches || matches.lenght == 0) {
    return;
  }

  let result = '';

  let inputCode = matches[0];
  if (inputCode.length < 3 && matches.length === 1) {
    result = inputCode;
  } else {
    result += '(' + inputCode.substring(0, 3) + ')';

    if (matches.length > 1) {
      let inputNumber = matches[1];

        result += ' ';
        result += inputNumber.substring(0, 3);

        if (matches.length == 2 && inputNumber.length > 3) {
          result += '-';
          result += inputNumber.substring(3, 4);
        }
    }
            
    if (matches.length > 2) {
      let inputNumber = matches[2];

      result += '-';
      result += inputNumber.substring(0, 4);
    }
  }

  $(this).val(result);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<input type="text" class="form-control" name="contact_no" id="contact_no" placeholder="Contact Number">