当前位置:  编程技术>其它

如何使用JavaScript和正则表达式进行数据验证

    来源: 互联网  发布时间:2014-10-17

    本文导语:  数据验证是网络应用软件从客户端接受数据的重要步骤,毕竟,您需要在使用客户数据前确保其符合预期的格式。在网络应用程序中,您可以选择使用特定平台的工具,比如ASP.NET、JSP等等,或者您可以利用客户端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:

RegExp test


testRegExp = /search/i;
if (testRegExp.test("this is a search string")) {
alert("The string was found.");
} else {
alert("No match found.");
}


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


RegExp validation

function validate() {
var doc = document.test;
varvalName = 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");
}
varvalTime = 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)");
} }


Name:

Time:




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

    
 
 

您可能感兴趣的文章:

  • java使用正则表达校验手机号码示例(手机号码正则)
  • 正则表达式问题,使用正则表达式找出指定字符串并替换?
  • Javascript里的两种使用正则的方法
  • 哪些命令可以使用正则表达式
  • 正则表达式中使用变量赋值
  • java使用正则表达为数字添加千位符的简单方法
  • Linux find命令的搜索路径可否使用正则表达式
  • js 正则使用方法
  • 关于在shell脚本中使用正则表达式的问题
  • php使用正则过滤js脚本代码实例
  • 请问linux下有哪些轻量级的正则表达式库,我在一个应用中使用
  • 使用正则表达式复制问题:cp
  • 使用正则表达式替换表情符号核心代码
  • 怎么样使用正则表达式表示回文?
  • DreamWeaver中使用正则技术搜索
  • 正则在FireFox和IE下使用test的不同
  • asp match正则函数使用Matchs实例
  • python 正则式使用心得
  • 在C/C++里面使用正则表达式通配搜索,结果非预期
  • mysqlhotcopy 正则使用小技巧
  • Unix中最简单的问题:输入一个表达式,显示其结果。使用SCO OpenServer
  • python基础教程之lambda表达式使用方法
  • 在使用JDK1.4的正则表达式功能时,发现如果被搜索的字符太多,例如一篇文章.就会报错
  • 特急!!!如何使用regexp来进行正则表达式的匹配?
  • java正则表达式使用示例
  • C#的正则表达式Regex类使用简明教程
  • JavaScript 使用正则表达式进行表单验证的示例代码
  • c#字符串使用正则表达式示例
  • sp_executesql 使用复杂的Unicode 表达式错误的解决方法
  • c#使用正则表达式匹配字符串验证URL示例
  • 使用正则表达式匹配tsql注释语句
  •  
    本站(WWW.)旨在分享和传播互联网科技相关的资讯和技术,将尽最大努力为读者提供更好的信息聚合和浏览方式。
    本站(WWW.)站内文章除注明原创外,均为转载、整理或搜集自网络。欢迎任何形式的转载,转载请注明出处。












  • 相关文章推荐
  • 菜鸟问题:********如何在Javascript中使用ADO**********
  • 请问linux下有哪些轻量级的正则表达式库,我在一个应用中使用 iis7站长之家
  • 使用JavaScript实现的Flash运行环境 Gordon
  • 请问linux下有哪些轻量级的正则表达式库,我在一个应用中使用 iis7站长之家
  • 请问如何在Javascript中使用JSP语句?
  • 请教JSP变量在JavaScript中使用的问题.
  • 散点分,顺便问一下哪位有JavaScript的使用帮助资料<主要是里面的各种对象及方法属性的使用>
  • 为何我使用javascript中location'****.jsp'跳到某一页面,jsp页面不重新编译执行
  • 请问linux下有哪些轻量级的正则表达式库,我在一个应用中使用 iis7站长之家
  • 请问linux下有哪些轻量级的正则表达式库,我在一个应用中使用 iis7站长之家
  • javascript如何在.js文件中使用jsp中的变量
  • 想嵌套使用javascript,和jsp
  • 请问在Mozilla中如何使用click()事件?(javascript,html)。快快帮我啊!
  • python使用PyV8执行javascript代码示例分享
  • 使用jQuery异步加载 JavaScript脚本解决方案
  • 关于javascript冒泡与默认事件的使用详解
  • 使用Rhino让java执行javascript的方法实例
  • JavaScript 正则表达式使用详细参数
  • javascript中使用正则表达式实现删除字符串中的前后空格
  • 基于Android中Webview使用自定义的javascript进行回调的问题详解
  • C++ I/O 成员 tellg():使用输入流读取流指针
  • 在测试memset函数的执行效率时,分为使用Cash和不使用Cash辆种方式,该如何控制是否使用缓存?
  • C++ I/O 成员 tellp():使用输出流读取流指针
  • 求ibm6000的中文使用手册 !从来没用过服务器,现在急需使用它,不知如何使用! 急!!!!!
  • Python不使用print而直接输出二进制字符串
  • 请问:在使用oracle数据库作开发时,是使用pro*c作开发好些,还是使用库函数如oci等好一些啊?或者它们有什么区别或者优缺点啊?
  • Office 2010 Module模式下使用VBA Addressof
  • 急求结果!!假设一个有两个元素的信号量集S,表示了一个磁带驱动器系统,其中进程1使用磁带机A,进程2同时使用磁带机A和B,进程3使用磁带机B。
  • windows下tinyxml.dll下载安装使用(c++解析XML库)
  • c#中SAPI使用总结——SpVoice的使用方法
  • tcmalloc内存泄露优化c++开源库下载,安装及使用介绍


  • 站内导航:


    特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除!

    ©2012-2021,,E-mail:www_#163.com(请将#改为@)

    浙ICP备11055608号-3