submit не активна если номер не равен маски

Рейтинг: 2Ответов: 0Опубликовано: 13.08.2025

есть форма

<head>

  </script>
  <script src="js/mask.js"></script>
  <script src="js/mask_list.js"></script>

</head>

<form class="pay_form" action="">
  <input class="phone" type="text" name="phone" value="" placeholder="Phone">

  <button class="pay_btn btn" type="submit">Submit</button>
</form>
<script>
  mask(".phone");
</script>

и задана маска ввода номера телефона (mask.js)

const mask = (selector) => {
  function setMask() {
    let matrix = '+###############';

    maskList.forEach(item => {
      let code = item.code.replace(/[\s#]/g, ''),
        phone = this.value.replace(/[\s#-)(]/g, '');

      if (phone.includes(code)) {
        console.log(phone, code);
        matrix = item.code;
      }
    });

    let i = 0,
      val = this.value.replace(/\D/g, '');

    this.value = matrix.replace(/(?!\+)./g, function(a) {
      return /[#\d]/.test(a) && i < val.length ? val.charAt(i++) : i >= val.length ? '' : a;
    });
  }

  let inputs = document.querySelectorAll(selector);

  inputs.forEach(input => {
    if (!input.value) input.value = '';
    input.addEventListener('input', setMask);
    input.addEventListener('focus', setMask);
    input.addEventListener('blur', setMask);
  });
};

и маски телефонов (mask_list.js)

const maskList = [{
      "code": "+247 ####"
    },
    ......

но есть нюанс если просто оставить плюс или набрать короткий номер (кривой), который не соответствует маски, то кнопка submit активна.

Соответственно как сделать так, чтобы, когда номер телефона не совпадает маски, то есть набран криво, то кнопка submit неактивна

Все библиотеки брал отсюда https://github.com/liggth/inputmask-phones?tab=readme-ov-file

Ответы

Ответов пока нет.