利用客户端JavaScript的优势，JavaScript中的正则表达式可以简化数据验证的工作，下面与大家分享下如何使用JavaScript和正则表达式进行数据验证，感兴趣的朋友可以参考下哈

数据验证是网络应用软件从客户端接受数据的重要步骤，毕竟，您需要在使用客户数据前确保其符合预期的格式。在网络应用程序中，您可以选择使用特定平台的工具，比如ASP.NET、JSP等等，或者您可以利用客户端JavaScript的优势，JavaScript中的正则表达式可以简化数据验证的工作。

正则表达式 
正则表达式是一种模式匹配的工具，它允许您以文字方式来表述模式，因而正则表达式成为了一个验证文本数据的强大工具。除了模式匹配之外，正则表达式还可以用于文字替换。从我在UNIX系统上使用Perl时第一次接触到正则表达式开始，对正则表达式的支持就一直在不断延伸。 
注意：如果您身边有很多其他的开发者，正则表达式可能会被称作RegEx或者RegExp。尽管正则表达式的功能强大，不过其语法有点“神秘”，需要花一些时间来掌握，下面就让我们来看看使用正则表达式的一些基础知识。

基本语法 
正则表达式的语法可以应用得很复杂，甚至需要一整本书来讲解这个题目，但是我将讲解其中一部分基本知识来帮助您获取正则表达式的初步认识。 
一个基本概念是锚(anchor)，它允许您指定字符串的起点和终点，脱字符(^)用于指定字符串的起点而美元符号($)则表示终点。如果需要在查询字符串中含有脱字符或者美元符号，您可以使用转义序列来实现，转义字符()是优先于脱字符或者美元符号之处理的。以下的例子会在单词search在字符串中出现时进行匹配。

^search$ 
而且，您还可以查找一组字符，只要将它们放在方括号中就行了，比如[ and ]，相匹配的字符必需属于这个字符组，一个例子是在[12345]的范围内寻找匹配的数字1到5，该正则表达式也可以写作[1-5]。 
很多时候您可能需要指定可以出现多次的字符，或者可选的字符，问号(?)的意思是该字符是可选的，加号(+)的意思是该字符可以出现一次或者多次，星号(*)的意思是该字符可以不出现或者出现多次。 
现在让我们来看看如何将这些简单的正则表达式应用到JavaScript上。

JavaScript支持 
JavaScript在1.2版本中添加了对正则表达式的支持，浏览器的支持则开始于Internet Explorer 4和Netscape 4，所有的Firefox 版本以及大多数现代浏览器都包含了JavaScript的支持。正则表达式可以通过JavaScript的字符串和RegExp来使用。

使用字符串 
每个JavaScript字符串都可以通过三种方法来支持正则表达式，这三种方法是match()、replace()和search()，而且对象的test() 方法还允许您进行测试。以下是关于match()、replace()和search()方法的信息： 
match(): 用于正则表达式匹配，如果多个匹配出现，则返回一个含有所有匹配结果的数组，数组中的每一个条目都是一份包含了匹配数据的拷贝；如果没有匹配值，则返回空值。

replace(): 用于正则表达式匹配并将所有的匹配值替换为新的子字符串，本方法的第一个参数是正则表达式，第二个参数是进行替换的字符串。

search(): 用于在正则表达式与指定字符串之间搜索匹配值，如果出现匹配值，则返回字符串的索引值，如果没有匹配值，则返回-1。

JavaScript 还提供了RegExp对象来创建并使用正则表达式。

RegExp 
RegExp对象包含了正则表达式的模式，该对象的方法和属性可以用来匹配字符串，有两种方法可以用来创建RegExp对象的实例：使用构造函数或使用正则表达式文本模式的文字方式，第二个参数是可选的，该参数可以指定该搜索是全局的(g)、忽略大小写的(i)或者全局同时忽略大小写(gi)。以下的例子是使用构造函数创建RegExp对象的方法，在这个例子中，搜索对象的大小写是被忽略的代码如下:

testRegExp = new RegExp("^search$","I")

您可以使用文字方式来创建相同的实例(在斜杠中的部分)，如下所示：

代码如下:

testRegExp = /^search$/i

RegExp对象包含了大量的方法，但我们只介绍其中的一个方法test。该方法将对指定字符串进行正则表达式匹配，如果成功则返回true，失败则返回false，该方法可以应用在文字字符串或者字符串变量上，基本上，它允许您对一个字符串进行正则表达式匹配，以下的例子演示了如何使用这个方法：

代码如下:
testRegExp = /search/i;

if (testRegExp.test("this is a search string") {

document.write("The string was found.");

} else {

document.write("No match found.");

}

We can place it in a Web page to test:

<html><head>

<title>RegExp test</title>

</head><body>

<script language="javascript">

testRegExp = /search/i;

if (testRegExp.test("this is a search string")) {

alert("The string was found.");

} else {

alert("No match found.");

}

</script></body></html>

实际操作 
现在是讲解更加完整的例子的时候了，在列表A中的网页包含了JavaScript方法来验证文本框中输入的值，这段JavaScript代码将搜索包含我的姓氏和我的两个名字的字符串(忽略大小写)，如果找到了我的名字，则通过字符串对象的替换方法(search)将其替换为一个短名字。第二个文本框是用于接受时间值的，一个正则表达式在此对输入的时间进行合法性验证(数字是通过冒号分割的)。这个简单的例子说明了如何在您的客户端代码中加入正则表达式来进行匹配和替换：

 <html>

 <head>

 <title>RegExp validation</title>

 <script language="JavaScript">

 function validate() {

 var doc = document.test;

 var valName = new RegExp("^(Tony|Anthony) Patton", "i");

 if (doc.Name.value.match(valName) == null) {

 alert("Name was not found.");

 } else {

 doc.Name.value = doc.Name.value.replace(valName, "T. Patton");

 }

 var valTime = new RegExp("^([0-1][0-9]|[2][0-3]):([0-5][0-9])$");

 if (doc.time.value.match(valTime) == null) {

 alert("Please enter correct time format (hh:ss)");

 } }

 </script>

 </head>

 <body>

 <form name="test">

 Name: <input type="text" name="Name" value=""><br>

 Time: <input type="text" name="time" value=""><br>

 <input type="button" name="test" value="test" onClick="validate();">

 </form>

 </body>

 </html>

强大而复杂 
正则表达式的功能确实很强大，但是使用起来也并不简单，因此，应当循序渐进地学习，当然，它确实值得您花上一些时间来学习如何正确使用。正则表达式为JavaScript (以及其他的语言)操作文本，通用软件进行表单验证提供了一个简单而优雅的方法。

如何使用JavaScript和正则表达式进行数据验证的更多相关文章

  1. JavaScript 数据验证类

    JavaScript 数据验证类 /* JavaScript:验证类 author:杨波 date:20160323 1.用户名验证 2.密码验证 3.重复密码验证 4.邮箱验证 5.手机号验证 6. ...

  2. JavaScript 关于金额、数字验证的正则表达式

    JavaScript 关于金额.数字验证的正则表达式 function ismoney(money) { var reg = /(^[1-9]([0-9]+)?(\.[0-9]{1,2})?$)|(^ ...

  3. MVC 数据验证

    MVC 数据验证 前一篇说了MVC数据验证的例子,这次来详细说说各种各样的验证注解.System.ComponentModel.DataAnnotations 一.基础特性 一.Required 必填 ...

  4. javascript中正则表达式的基础语法

    × 目录 [1]定义 [2]特点 [3]元字符[4]转义字符[5]字符组[6]量词[7]括号[8]选择[9]断言[10]模式[11]优先级[12]局限性 前面的话 正则表达式在人们的印象中可能是一堆无 ...

  5. MVC 数据验证[转]

    前一篇说了MVC数据验证的例子,这次来详细说说各种各样的验证注解. 一.基础特性 一.Required 必填选项,当提交的表单缺少该值就引发验证错误. 二.StringLength 指定允许的长度 指 ...

  6. MVC Model数据验证

    概述 上节我们学习了Model的数据在界面之间的传递,但是很多时候,我们在数据传递的时候为了确保数据的有效性,不得不给Model的相关属性做基本的数据验证. 本节我们就学习如何使用 System.Co ...

  7. mvc 数据验证金钱格式decimal格式验证

    mvc 数据验证金钱格式decimal格式验证 首先看下代码 /// <summary> /// 产品单价 /// </summary> [Display(Name = &qu ...

  8. MVC 3 数据验证 Model Validation 详解

    在MVC 3中 数据验证,已经应用的非常普遍,我们在web form时代需要在View端通过js来验证每个需要验证的控件值,并且这种验证的可用性很低.但是来到了MVC 新时代,我们可以通过MVC提供的 ...

  9. (转)MVC 3 数据验证 Model Validation 详解

    继续我们前面所说的知识点进行下一个知识点的分析,这一次我们来说明一下数据验证.其实这是个很容易理解并掌握的地方,但是这会浪费大家狠多的时间,所以我来总结整理一下,节约一下大家宝贵的时间. 在MVC 3 ...

随机推荐

  1. Struts2的标签库（三）——控制标签

    Struts2的标签库(三) --控制标签 1.if/elseif/else标签 用于分支控制,取代JSP中的if语句,根据一个boolean(test属性的值)值判断是否进行下一步运算或者输出等. ...

  2. 启动Print Spooler服务提示:"错误1068,依存服务或无法启动"

    本人windows8操作系统,从网上看到在运行中输入  sc config spooler depend= rpcss 即可,试了下果然有效.具体原因待了解.

  3. Python3基础 print 中使用+号，连接两个字符串

    镇场诗:---大梦谁觉,水月中建博客.百千磨难,才知世事无常.---今持佛语,技术无量愿学.愿尽所学,铸一良心博客.------------------------------------------ ...

  4. SqlSever基础 rtrim函数 除去字符串的右边的空格，左边中间的不管

    镇场诗:---大梦谁觉,水月中建博客.百千磨难,才知世事无常.---今持佛语,技术无量愿学.愿尽所学,铸一良心博客.------------------------------------------ ...

  5. BZOJ 2132 圈地计划（最小割）

    题目链接:http://61.187.179.132/JudgeOnline/problem.php?id=2132 题意:n*m的格子染色黑白,对于格子(i,j)染黑色则价值为A[i][j],白色为 ...

  6. sql 执行计划

    SQL Server执行计划的理解 要理解执行计划,怎么也得先理解,那各种各样的名词吧.鉴于自己还不是很了解.本文打算作为只写懂的,不懂的懂了才写. 在开头要先说明,第一次看执行计划要注意,SQL S ...

  7. Qt根据汉字生成位图，可连续调用，生成的位图不会有杂点

    void MainWindow::drawText(int font_size, QString str, int n){ QPainter p; QSize size(460, font_size) ...

  8. ServiceStack.OrmLite 学习笔记7-复杂点的使用1

    复杂点的使用1 先看看这2个类 class Customer { public int Id { get; set; } ... } class CustomerAddress { public in ...

  9. 关于版本号：alpha、beta、rc、stable

    定义好版本号,对于产品的版本发布与持续更新很重要: 但是对于版本怎么定义,规则如何确定,却是千差万别.具体应用,可以结合自己目前的实际情况命名: 很多软件在正式发布前都会发布一些预览版或者测试版,一般 ...

  10. 汇编语言指令与debug命令符

    •MOV与ADD指令 汇编指令 控制CPU完成的操作 形式化语法描述 mov ax, 18 将18送入AX (AX)=18 mov   ah, 78 将78送入AH (AH)=78 add ax, 8 ...