JavaScript电话号码验证-错误消息前缀

时间:2019-02-19 04:04:57

标签: javascript dom

目标:

必须使用以下格式输入电话号码:208-111-1111;否则显示错误信息。 当用户以正确的格式输入错误消息时,显示错误消息的最佳方法是什么,但是如果用户以正确的格式重新输入,错误消息将消失。

JS
phoneNumber = document.getElementById("phone");


var result = phoneNumber.toString().match(/^\d{3}-\d{3}-\d{4}$/);

function validatePhone(){
if (result == null)
{
error2.innerHTML = "The number is not in a correct format";
} else 
{
error2.innerHTML = " ";
};
}

HTML
<p>Phone:</p> 
      <input type = "text" id="phone" name="phone" onChange="validatePhone()">
      <br>
      <span id="error2" ></span>

2 个答案:

答案 0 :(得分:2)

function validatePhone() {
  phoneNumber = document.getElementById("phone");
  var result = phoneNumber.value.match(/^(\d{3}-\d{3}-\d{4})?$/);
  if (result == null) {
    error2.innerHTML = "The number is not in a correct format";
  } else {
    error2.innerHTML = " ";
  };
}
<p>Phone:</p>
<input type="text" id="phone" name="phone" oninput="validatePhone()">
<br>
<span id="error2"></span>

答案 1 :(得分:0)

问题出在phoneNumber.toString()电话上。

在DOM输入元素上调用toString()不会返回用户输入的值。 toString()旨在提供被调用对象的字符串表示形式,而不是检索该对象持有的值。

phoneNumber.value将返回您要查找的值。