Как сделать так, чтобы Firefox рассматривал знак плюс как допустимый ввод в номере типа ввода?

В Chrome скрипт отлично работает как + рассматривается как часть числа. Тем не менее, в Firefox, скажем, для ввода типа номера, вы вводите + а затем номер мобильного телефона, он считает его недействительным. Даже если он содержит действительные числа, if условие ниже все еще оказывается true и предупреждение отображается. https://jsfiddle.net/4xo50sdt

function validation() {
  if($("#num").val() == "") {
    alert("enter a valid mobile number");
  }
}
<script
  src="https://code.jquery.com/jquery-3.3.1.min.js"
  integrity="sha256-FgpCb/KJQlLNfOu91ta32o/NMZxltwRo8QtmkMRdAu8="
  crossorigin="anonymous"></script>
<input type="number" id="num">
<input type="button" onclick="validation()"; value="submit">

1 ответ

Как говорят многие люди в комментариях к вашему вопросу, есть ли смысл использовать type="number" при вводе или получении телефонных / мобильных номеров, потому что они на самом деле не являются номерами. Как уже говорилось, он может содержать такие символы, как +, #, +, - и все это не числа, то input из type=number не приму их.

Мое предложение состоит в том, чтобы следовать за комментарием @scrappedcola.

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

document.getElementById("inputPhone").onkeypress = function(ev){
  if (ev.key == "Backspace"){
    this.value = this.value.substring(0,this.value.length-1);
    
  } else if(isNaN(parseInt(ev.key)) && ev.key != "+"){
      ev.preventDefault;
      return false;
  }
}

function checkNumber(){
  console.log(document.getElementById("inputPhone").value)
}
<input type="number" id="inputPhone"/>
<button onclick="checkNumber()">Get Number</button>

Другие вопросы по тегам