JavaScript手机号校验

一、js手机号校验代码

function validatePhoneNumber(phoneNumber) {
  if (phoneNumber.length !== 11) {
      return false;
  }
  var reg = /^1\d{10}$/;
  return reg.test(phoneNumber);
}

手机号码的位数为11位，因此可以先进行长度验证。然后通过正则表达式判断是否为手机号。这里使用了以1开头，后面跟10个数字的正则表达式来进行验证。如果验证通过则返回true，否则返回false。

二、js手机号正则校验

function validatePhoneNumber(phoneNumber) {
  var reg = /^1\d{10}$/;
  return reg.test(phoneNumber);
}

正则表达式是验证手机号码的最常用方法。上面的代码中，/^1\d{10}$/表示以1开头后面跟10个数字的模板。其中^表示开头，$表示结尾。 \d是匹配任意数字的符号。{10}是匹配10个数字的意思。

三、js手机号脱敏

function maskPhoneNumber(phoneNumber) {
  return phoneNumber.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2');
}

在有些场合下，需要对手机号进行加密或脱敏。这里使用了正则表达式，将手机号的第4到7位用星号代替。其中(\d{3})和(\d{4})是分组，$1和$2是分别用来替换第一个分组和第二个分组的占位符。

四、js获取手机号

navigator.contacts.pickContact(function(contact){
  var phoneNumber = contact.phoneNumbers[0].value;
  document.getElementById("phoneNumberField").value = phoneNumber;
},function(err){
});

在移动端，我们有时候需要从通讯录中获取手机号。这里使用了cordova提供的contacts插件，来获取第一个联系人的手机号，然后将手机号赋值给id为phoneNumberField的input元素。

五、js手机号正则表达式

/^1\d{10}$/

正则表达式是验证手机号码的最常用方法之一。上面的代码中，/^1\d{10}$/表示以1开头后面跟10个数字的模板。其中^表示开头，$表示结尾。 \d是匹配任意数字的符号。{10}是匹配10个数字的意思。

六、js验证手机号

function validatePhoneNumber() {
  var phoneNumber = document.getElementById("phoneNumberField").value;
  if (phoneNumber === "") {
      alert("手机号不能为空！");
      return false;
  }
  if (!validatePhoneNumber(phoneNumber)) {
      alert("手机号格式不正确！");
      return false;
  }
  return true;
}

在实际应用中，我们通常需要对用户输入的手机号进行验证。上面的代码中，首先获取id为phoneNumberField的input元素中的手机号。然后通过validatePhoneNumber函数来进行验证，如果验证不通过则弹出提示框，并返回false，否则返回true。

七、js手机号码验证

function validatePhoneNumber(phoneNumber) {
  if (phoneNumber.length !== 11) {
      return false;
  }
  var reg = /^1\d{10}$/;
  return reg.test(phoneNumber);
}

function validatePhoneNumberField() {
  var phoneNumberField = document.getElementById("phoneNumberField");
  var phoneNumber = phoneNumberField.value;
  if (!validatePhoneNumber(phoneNumber)) {
      phoneNumberField.setCustomValidity("手机号格式不正确！");
  } else {
      phoneNumberField.setCustomValidity("");
  }
}

在表单提交前，我们需要对手机号进行格式验证。上面的代码中，validatePhoneNumber函数用来校验手机号的格式是否正确。如果手机号格式不正确，则调用setCustomValidity函数设置手机号输入框的验证提示信息为“手机号格式不正确！”。

八、js验证手机号号

$("#phoneNumberField").on("blur", function(){
  var phoneNumber = $(this).val();
  if (!validatePhoneNumber(phoneNumber)) {
      alert('请输入正确的手机号');
      $(this).val("");
      $(this).focus();
  }
});

在某些情况下，我们需要实时验证输入的手机号是否正确。如上面的代码，在phoneNumberField的失焦事件中，获取输入框中的手机号，然后调用validatePhoneNumber函数来进行验证。如果验证不通过，则弹出提示框，并将手机号输入框的值设置为空，并重新聚焦在该输入框上。

原创文章，作者：MCGOL，如若转载，请注明出处：https://www.506064.com/n/317771.html