js正则表达式验证(化繁为简)
以前用js写正则表达式验证,每一个文本框后面都要添加一个onblur函数,验证的信息少,也没体会到有多繁琐,这次项目中的页面比较多,页面中的信息也比较多,如果每个文本框都加一个验证函数的话,js验证代码将会很长,很繁琐。
既然是函数,就可以传参数,这样的话,只需要一个验证函数就可以完成所有的信息验证了。
1、首先新建一个js文件validate.js
function validate(o,regex,backInfo){
if(o.value != "" && !regex.test(o.value)){
alert(backInfo);
o.value="";
o.focus();
}
}
参数解释:
o:文本框(标签)对象;
regex:是正则表达式;
backInfo:是输入不符合条件时返回的错误信息。
2、在页面中引入validate.js
在onblur函数中调用
<input type="text" id="userName" name="username"
onblur="validate(this,regex=/正则表达式/,backInfo='错误信息')" placeholder="默认提示信息">
例:
<input type="text" id="userAmount" name="userAmount"
onblur="validate(this,regex=/^\d+$/,backInfo='输入错误')" placeholder="请输入整数">
代码比之前简洁了许多,易于修改,只要在需要做验证的页面引入js并添加相应的函数即可,
现在只需要填入相应的正则表达式就可以了。
对js了解不多,有好的方法,欢迎批评指点。
js正则表达式验证(化繁为简)的更多相关文章
- JS正则表达式验证账号、手机号、电话和邮箱
JS正则表达式验证账号.手机号.电话和邮箱 效果体验:http://keleyi.com/keleyi/phtml/jstexiao/15.htm 验证帐号是否合法 验证规则:字母.数字.下划线组成, ...
- js正则表达式验证
有时候会要验证自己写的正则表达式是否正确 所以写了这个小东西: demo:js正则表达式验证 html: <h3>绿色表示匹配,红色表示不匹配</h3> <label&g ...
- js正则表达式验证字符长度
原理,就是把一个汉字替换为两个字母,来实现长度验证. //js正则验证字符长度 第一种:直接输出长度 alert('1sS#符'.replace(/[^\x00-\xff]/g, 'AA').leng ...
- js正则表达式验证端口范围(0-65535)
javascript正则表达式验证IP地址的端口合法性 if (!(/^[1-9]\d*$/.test(port) && 1 <= 1 * port && 1 * ...
- js正则表达式验证大全
/判断输入内容是否为空 function IsNull(){ var str = document.getElementById('str').value.trim(); ...
- js 正则表达式验证
验证数字的正则表达式集 验证数字:^[0-9]*$ 验证n位的数字:^\d{n}$ 验证至少n位数字:^\d{n,}$ 验证m-n位的数字:^\d{m,n}$ 验证零和非零开头的数字:^(0|[1-9 ...
- js正则表达式验证大全--转载
转载来源:http://www.cnblogs.com/hai-ping/articles/2997538.html#undefined //判断输入内容是否为空 function IsNull(){ ...
- JS正则表达式验证数字
<script type="text/javascript"> function validate(){ var reg = new RegExp("^[0- ...
- JS --正则表达式验证、实战之邮箱模式
JS验证格式:提高用户体验,验证文本. 需要防止程序员的代码结构更改攻击,因为web段的代码有可能会被更改,更改后JS有可能会验证不住那么,C#端在JS段通过验证的情况下,还需要进行二次验证 < ...
随机推荐
- Chromium开发--入门C++小样例
開始做Chromium开发的时候,都是从代码去摸索的,如今有几个样例了.希望看到的同学能有帮助,比直接在大量代码里领悟要快非常多了. C++ in Chromium 101 - Codelab h ...
- iphone断点下载,断点续传
本文转载至 http://blog.csdn.net/zaitianaoxiang/article/details/6650469 - (void)loadView { NSURLConnection ...
- Martin Fowler’s Active Record design pattern.
P of EAA: Active Record https://www.martinfowler.com/eaaCatalog/activeRecord.html Active Record An o ...
- SQLServer与ASP中DATEDIFF函数区别
一.SQLServer: 格式: DATEDIFF(interval,startdate,enddate) interval参数: 年-yy,yyyy 季度-qq,q 月-mm,m 年中的日-dy,y ...
- MySQL中Index Condition Pushdown(ICP)优化
在MySQL 5.6开始支持的一种根据索引进行查询的优化方式.之前的MySQL数据库版本不支持ICP,当进行索引查询是,首先根据索引来查找记录,然后在根据WHERE条件来过滤记录.在支持ICP后,My ...
- Linux中的特殊字符
单引号: 在单引号中所有的特殊字符都没有特殊含义 双引号: 在双引号中 $ ` \ 三个字符表示,调用变量的值.引用命令.转义,其他特殊字符均没有特殊含义 反引号: 用反引号括起来的内容被当作系统命令 ...
- OC、C#与JAVA语法特点一些异同(差集&交集)
C#对JAVA: 1.扩展方法 2.部分类 3.动态对象 4.匿名返回类型 5.表达式树 6.Linq 7.没有函数指针,委托,事件的直接提供方式 8.JAVA接口不规定以I开头,这个很烂的思想! J ...
- Windows系统Python 安装第三方模块时,提示pip版本有问题
如果按照提示输入python -m pip install --upgrade pip 还不行, 那么执行easy_install --upgrade pip 即可 参考:https://stacko ...
- Android学习资源网站大全
https://github.com/zhujun2730/Android-Learning-Resources 整理了一些 Android 的博客链接.学习资源网站.站在巨人的肩膀上,会看得更远.整 ...
- idea java web 使用说明
String realPath = request.getSession().getServletContext().getRealPath(uploadPath);//上传压缩包所在目录 ...