JavaScript 常见数据验证正则表达式与实用函数

小鹿同学
小鹿同学
发布时间:2026-10-13 | 6人浏览过
原创

本文整理了 JavaScript 前端开发中高频使用的数据验证方案,包括 IP 地址、手机号码、电子邮箱、日期格式及数字类型等场景的校验逻辑。通过解析正则表达式规则并结合辅助函数,提供了一套可直接嵌入项目的验证代码片段,帮助开发者快速实现表单输入的合法性检查。

基础类型与特殊字符验证

在处理用户输入时,首先需要对基本的数据形态进行过滤。以下函数用于判断字符串是否为空白、纯整数、正整数或包含小数点的负数/正数,同时支持检查由英文字母、数字及下划线组成的混合字符串。

// 检查输入字符串是否为空或者全部都是空格
function isNull(str) {
  if (str == "") return true;
  var regu = "^[ ]+$";
  var re = new RegExp(regu);
  return re.test(str);
}

// 检查输入对象的值是否符合整数格式(允许负号)
function isInteger(str) {
  var regu = /^[-]{0,1}[0-9]{1,}$/;
  return regu.test(str);
}

// 检查输入字符串是否是带小数的数字格式,可以是负数
function isDecimal(str) {
  if (isInteger(str)) return true;
  var re = /^[-]{0,1}(\d+)[\.]+(\d+)$/;
  if (re.test(str)) {
    if (RegExp.$1 == 0 && RegExp.$2 == 0) return false;
    return true;
  } else {
    return false;
  }
}

// 检查输入字符串是否只由英文字母和数字组成
function isNumberOrLetter(s) {
  var regu = "^[0-9a-zA-Z]+$";
  var re = new RegExp(regu);
  if (re.test(s)) {
    return true;
  } else {
    return false;
  }
}

// 检查输入字符串是否只由汉字、字母、数字组成
function isChinaOrNumbOrLett(s) {
  var regu = "^[0-9a-zA-Z\u4e00-\u9fa5]+$";
  var re = new RegExp(regu);
  if (re.test(s)) {
    return true;
  } else {
    return false;
  }
}

网络标识与联系方式验证

针对网络连接和用户通讯信息,通常采用特定的格式约束。IP 地址需要确保四个段落均小于 256;手机号码目前主要校验中国大陆的 13x 号段;邮箱地址则遵循用户名@域名.tld 的标准结构。

// 用途:校验ip地址的格式
function isIP(strIP) {
  if (isNull(strIP)) return false;
  var re = /^(\d+)\.(\d+)\.(\d+)\.(\d+)$/g; //匹配IP地址的正则表达式
  if (re.test(strIP)) {
    if (RegExp.$1 < 256 && RegExp.$2 < 256 && RegExp.$3 < 256 && RegExp.$4 < 256) return true;
  }
  return false;
}

// 用途:检查输入手机号码是否正确 (中国大陆13x号段)
function checkMobile(s) {
  var regu = /^[1][3][0-9]{9}$/;
  var re = new RegExp(regu);
  if (re.test(s)) {
    return true;
  } else {
    return false;
  }
}

// 用途:检查输入对象的值是否符合E-Mail格式
function isEmail(str) {
  var myReg = /^[-_A-Za-z0-9]+@([_A-Za-z0-9]+\.)+[A-Za-z0-9]{2,3}$/;
  if (myReg.test(str)) return true;
  return false;
}

// 改进版:更通用的邮箱验证
function checkEmail(strEmail) {
  var emailReg = /^[\w-]+(\.[\w-]+)*@[\w-]+(\.[\w-]+)+$/;
  if (emailReg.test(strEmail)) {
    return true;
  } else {
    alert("您输入的Email地址格式不正确!");
    return false;
  }
}

金融数值与端口号验证

  1. 金额校验:定义为带小数的正数,小数点后最多三位。
  2. 端口号校验:必须是数字且范围在 0-65535 之间。
// 用途:检查输入字符串是否符合金额格式
function isMoney(s) {
  var regu = "^[0-9]+[\.][0-9]{0,3}$";
  var re = new RegExp(regu);
  if (re.test(s)) {
    return true;
  } else {
    return false;
  }
}

// 用途:检查输入对象的值是否符合端口号格式
function isPort(str) {
  return (isNumber(str) && str < 65536);
}

// 辅助:检查输入字符串是否符合正整数格式
function isNumber(s) {
  var regu = "^[0-9]+$";
  var re = new RegExp(regu);
  if (s.search(re) != -1) {
    return true;
  } else {
    return false;
  }
}

日期与时间范围验证

日期验证不仅检查格式,还涉及日历逻辑(如闰年2月天数、月份上限)。以下函数支持指定格式的日期解析,以及起止日期的比较逻辑。

// 辅助:获取某年某月的最大天数
function getMaxDay(year, month) {
  if (month == 4 || month == 6 || month == 9 || month == 11) return "30";
  if (month == 2) {
    if (year % 4 == 0 && year % 100 != 0 || year % 400 == 0) return "29";
    else return "28";
  }
  return "31";
}

// 用途:判断是否是日期 (默认格式 yyyyMMdd)
function isDate(date, fmt) {
  if (fmt == null) fmt = "yyyyMMdd";
  var yIndex = fmt.indexOf("yyyy");
  if (yIndex == -1) return false;
  var year = date.substring(yIndex, yIndex + 4);
  var mIndex = fmt.indexOf("MM");
  if (mIndex == -1) return false;
  var month = date.substring(mIndex, mIndex + 2);
  var dIndex = fmt.indexOf("dd");
  if (dIndex == -1) return false;
  var day = date.substring(dIndex, dIndex + 2);

  if (!isNumber(year) || year > "2100" || year < "1900") return false;
  if (!isNumber(month) || month > "12" || month < "01") return false;
  if (day > getMaxDay(year, month) || day < "01") return false;
  return true;
}

// 用途:检查输入的起止日期是否正确
function checkTwoDate(startDate, endDate) {
  if (!isDate(startDate)) {
    alert("起始日期不正确!");
    return false;
  } else if (!isDate(endDate)) {
    alert("终止日期不正确!");
    return false;
  } else if (startDate > endDate) {
    alert("起始日期不能大于终止日期!");
    return false;
  }
  return true;
}

UI 交互与辅助工具函数

除了数据校验,前端开发常需处理复选框状态、字符串修剪及子串匹配等操作。以下函数提供了批量操作复选框、去除首尾空格及判断字符串前缀后缀的能力。

// 用途:检查复选框被选中的数目
function checkSelect(checkboxID) {
  var check = 0;
  var i = 0;
  if (document.all(checkboxID).length > 0) {
    for (i = 0; i < document.all(checkboxID).length; i++) {
      if (document.all(checkboxID).item(i).checked) {
        check += 1;
      }
    }
  } else {
    if (document.all(checkboxID).checked) check = 1;
  }
  return check;
}

// function: cTrim(sInputString,iType) - 字符串去空格
// iType: 1=左空格, 2=右空格, 0=左右空格
function cTrim(sInputString, iType) {
  var sTmpStr = ' ';
  var i = -1;
  if (iType == 0 || iType == 1) {
    while (sTmpStr == ' ') {
      ++i;
      sTmpStr = sInputString.substr(i, 1);
    }
    sInputString = sInputString.substring(i);
  }
  if (iType == 0 || iType == 2) {
    sTmpStr = ' ';
    i = sInputString.length;
    while (sTmpStr == ' ') {
      --i;
      sTmpStr = sInputString.substr(i, 1);
    }
    sInputString = sInputString.substring(0, i + 1);
  }
  return sInputString;
}

// 用途:字符1是否以字符串2开始
function isFirstMatch(str1, str2) {
  var index = str1.indexOf(str2);
  if (index == 0) return true;
  return false;
}

// 用途:字符1是否以字符串2结束
function isLastMatch(str1, str2) {
  var index = str1.lastIndexOf(str2);
  if (str1.length == index + str2.length) return true;
  return false;
}

特定业务场景校验

在证券或特定行业应用中,可能需要校验固定长度的代码(如6位证券代码)或电话号码格式(区号-号码)。

// 用途:检查证券代码是否正确 (6位数字)
function checkSecCode(secCode) {
  if (secCode.length != 6) {
    alert("证券代码长度应该为6位");
    return false;
  }
  if (!isNumber(secCode)) {
    alert("证券代码只能包含数字");
    return false;
  }
  return true;
}

// 用途:检查输入的电话号码格式是否正确
function checkPhone(strPhone) {
  var phoneRegWithArea = /^[0][1-9]{2,3}-[0-9]{5,10}$/;
  var phoneRegNoArea = /^[1-9]{1}[0-9]{5,8}$/;
  var prompt = "您输入的电话号码不正确!";
  if (strPhone.length > 9) {
    if (phoneRegWithArea.test(strPhone)) {
      return true;
    } else {
      alert(prompt);
      return false;
    }
  } else {
    if (phoneRegNoArea.test(strPhone)) {
      return true;
    } else {
      alert(prompt);
      return false;
    }
  }
}
以上就是 JavaScript 中常用的验证正则表达式的详细内容,更多关于 JavaScript 前端验证技巧的资料请关注本站其它相关文章!

本站声明

本文内容仅供参考,不代表本站观点。转载或引用请注明出处。如发现内容问题,请通过联系我们页面反馈。

Python 相关产品和应用

全部下载

专题列表