正则表达js验证范例PDF

根据提供的文件信息，我们可以总结出一系列与正则表达式在JavaScript中的应用相关的知识点。下面将对这些函数逐一进行解析，并详细介绍其应用场景和技术要点。 ### 一、正则表达式简介 正则表达式（Regular Expression）是一种强大的文本处理工具，可以用来匹配、查找、替换等操作。在JavaScript中，正则表达式广泛应用于表单验证、数据提取等方面。 ### 二、函数详解 #### 1. 判断输入内容是否为空 (`IsNull`) **功能**: 检查用户输入的字段是否为空或仅包含空格。 **正则表达式**: `trim()` 方法用于去除字符串两端的空白字符。 **代码实现**: ```javascript function IsNull() { var str = document.getElementById('str').value.trim(); if (str.length == 0) { alert('对不起，文本框不能为空或者为空格!'); } } ``` #### 2. 判断日期类型是否为 `YYYY-MM-DD` 格式 (`IsDate`) **功能**: 验证用户输入的日期是否符合 `YYYY-MM-DD` 的格式。 **正则表达式**: ```regex /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/ ``` 其中： - `\d{1,4}` 匹配1到4位数字。 - `(-|\/)` 匹配 `-` 或 `/`。 - `\2` 引用前面捕获的分隔符，确保年月日之间的分隔符一致。 **代码实现**: ```javascript function IsDate() { var str = document.getElementById('str').value.trim(); if (str.length != 0) { var reg = /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/; var r = str.match(reg); if (r == null) alert('对不起，您输入的日期格式不正确!'); } } ``` #### 3. 判断日期类型是否为 `YYYY-MM-DD hh:mm:ss` 格式 (`IsDateTime`) **功能**: 验证用户输入的时间是否符合 `YYYY-MM-DD hh:mm:ss` 的格式。 **正则表达式**: ```regex /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})(\d{1,2}):(\d{1,2}):(\d{1,2})$/ ``` **代码实现**: ```javascript function IsDateTime() { var str = document.getElementById('str').value.trim(); if (str.length != 0) { var reg = /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})(\d{1,2}):(\d{1,2}):(\d{1,2})$/; var r = str.match(reg); if (r == null) alert('对不起，您输入的日期格式不正确!'); } } ``` #### 4. 判断日期类型是否为 `hh:mm:ss` 格式 (`IsTime`) **功能**: 验证用户输入的时间是否符合 `hh:mm:ss` 的格式。 **正则表达式**: ```regex /^((20|21|22|23|[0-1]\d)\:[0-5][0-9])(\:[0-5][0-9])?$/ ``` **代码实现**: ```javascript function IsTime() { var str = document.getElementById('str').value.trim(); if (str.length != 0) { var reg = /^((20|21|22|23|[0-1]\d)\:[0-5][0-9])(\:[0-5][0-9])?$/; if (!reg.test(str)) { alert("对不起，您输入的时间格式不正确!"); } } } ``` #### 5. 判断输入的字符是否为英文字母 (`IsLetter`) **功能**: 验证用户输入的是否全是英文字母。 **正则表达式**: ```regex /^[a-zA-Z]+$/ ``` **代码实现**: ```javascript function IsLetter() { var str = document.getElementById('str').value.trim(); if (str.length != 0) { var reg = /^[a-zA-Z]+$/; if (!reg.test(str)) { alert("对不起，您输入的英文字母类型格式不正确!"); } } } ``` #### 6. 判断输入的字符是否为整数 (`IsInteger`) **功能**: 验证用户输入的是否为整数。 **正则表达式**: ```regex /^[-+]?\d*$/ ``` **代码实现**: ```javascript function IsInteger() { var str = document.getElementById('str').value.trim(); if (str.length != 0) { var reg = /^[-+]?\d*$/; if (!reg.test(str)) { alert("对不起，您输入的整数类型格式不正确!"); } } } ``` #### 7. 判断输入的字符是否为双精度 (`IsDouble`) **功能**: 验证用户输入的是否为双精度浮点数。 **正则表达式**: ```regex /^[-\+]?\d+(\.\d+)?$/ ``` **代码实现**: ```javascript function IsDouble(val) { var str = document.getElementById('str').value.trim(); if (str.length != 0) { var reg = /^[-\+]?\d+(\.\d+)?$/; if (!reg.test(str)) { alert("对不起，您输入的双精度类型格式不正确!"); } } } ``` #### 8. 判断输入的字符是否为字母数字组合 (`IsString`) **功能**: 验证用户输入的是否只包含字母、数字或下划线。 **正则表达式**: ```regex /^[a-zA-Z0-9_]+$/ ``` **代码实现**: ```javascript function IsString() { var str = document.getElementById('str').value.trim(); if (str.length != 0) { var reg = /^[a-zA-Z0-9_]+$/; if (!reg.test(str)) { alert("对不起，您输入的字符串类型格式不正确!"); } } } ``` ### 三、总结 以上介绍了多个常用的正则表达式函数及其具体实现方式，它们可以帮助开发者在实际项目中高效地完成各种数据验证任务。通过合理运用这些函数，可以极大地提高前端表单的用户体验，同时减少因输入错误而导致的后端服务器压力。在开发过程中，理解并掌握这些正则表达式的使用方法是非常重要的。