js动态拼接正则表达式的两种方法


Posted in Javascript onMarch 04, 2014

方法一:

做项目的时候可能会遇到用js验证表单输入正确性的需求,这时候就需要用到js的正则表达式。举个例子:比如说要验证月份,格式为:'yyyy-MM',这个正则表达式写起来很简单,实在写不出,也可以Google、百度一把,网上例子一大堆!但是js正则表达式就这样写死也会带来新的问题:如果配置文件的月份格式改了呢?改成'yyyyMM'、或者是'yyyy_MM'...呢??我们是不是要记得去把js中的正则表达式也跟着一遍遍的改呢??

这时候我们就要问了:怎样才能写出动态的正则表达式呢,修改了配置文件,就不需要再去动代码了呢?

笔者翻阅了js手册,没有找到将字符串转换成正则表达式的方法,但是可以用eval();方法动态执行脚本的方式间接解决这个问题!从而写出更加通用的代码!

下面贴出上例的通用解决方案:

/** 
* 验证月份表单输入是否合法 
* pattern : 月份格式字符串 
* id : 表单id 
*/ 
function validateMonth(pattern, id) { 
var text = document.getElementById(id); 
var monthStr = text.value; 
var splitChar = ""; 
if(pattern.length > 6) splitChar = pattern.substring(4, pattern.length - 2); 
eval("var re = /\\d{4}" + splitChar + "\\d{2}$/;"); 
//var re = /\d{4}-\d{2}$/; 
if(monthStr.match(re) == null) { 
alert("请参考格式[" + pattern + "]输入!\n" + "e.g \"2010" + splitChar + "11\" or \"2010" + splitChar + "03\""); 
text.value = ""; 
text.focus(); 
return false; 
} 
return true; 
}

/** 
* 验证月份表单输入是否合法 
* pattern : 月份格式字符串 
* id : 表单id 
*/ 
function validateMonth(pattern, id) { 
var text = document.getElementById(id); 
var monthStr = text.value; 
var splitChar = ""; 
if(pattern.length > 6) splitChar = pattern.substring(4, pattern.length - 2); 
eval("var re = /\\d{4}" + splitChar + "\\d{2}$/;"); 
//var re = /\d{4}-\d{2}$/; 
if(monthStr.match(re) == null) { 
alert("请参考格式[" + pattern + "]输入!\n" + "e.g \"2010" + splitChar + "11\" or \"2010" + splitChar + "03\""); 
text.value = ""; 
text.focus(); 
return false; 
} 
return true; 
}

有一点值得注意:动态拼出脚本字符串传给eval()方法执行时,需要对字符'\'转义

方法二:

<script> 
var n=new Array( ".htm ", ".html ", ".shtml "); 
//var pattern1 = new RegExp( "\\w+\\ "+n[0]+ "$ ", "gi "); 
var s1= "b.shtml "; 
var result = false; 
for(var i=0;i <n.length;i++) 
{ 
pattern1 = new RegExp( "\\w+\\ "+n[i]+ "$ ", "gi "); 
result|=pattern1.test(s1); 
} 
alert(Boolean(result)); 
</script>
Javascript 相关文章推荐
扩展String功能方法
Sep 22 Javascript
基于jquery的用鼠标画出可移动的div
Sep 06 Javascript
浅析jQuery(function(){})与(function(){})(jQuery)之间的区别
Jan 09 Javascript
JavaScript保存并运算页面中数字类型变量的写法
Jul 06 Javascript
js实现简洁的TAB滑动门效果代码
Sep 06 Javascript
js和jquery分别验证单选框、复选框、下拉框
Dec 17 Javascript
原生javascript实现addClass,removeClass,hasClass函数
Feb 25 Javascript
详解webpack3编译兼容IE8的正确姿势
Dec 21 Javascript
vue父组件给子组件的组件传值provide inject的方法
Oct 23 Javascript
vue+element实现图片上传及裁剪功能
Jun 29 Javascript
在vue中使用console.log无效的解决
Aug 09 Javascript
wepy--用vantUI 实现上弹列表并选择相应的值操作
Nov 03 Javascript
8个实用的jQuery技巧
Mar 04 #Javascript
js中top的作用深入剖析
Mar 04 #Javascript
父页面显示遮罩层弹出半透明状态的dialog
Mar 04 #Javascript
深入理解JS中的变量及作用域、undefined与null
Mar 04 #Javascript
css+js实现部分区域高亮可编辑遮罩层
Mar 04 #Javascript
JavaScript程序员应该知道的45个实用技巧
Mar 04 #Javascript
js判断url是否有效的两种方法
Mar 04 #Javascript
You might like
Ajax实时验证用户名/邮箱等是否已经存在的代码打包
2011/12/01 PHP
PHP文章按日期(月日)SQL归档语句
2012/11/29 PHP
Codeigniter的dom类用法实例
2015/06/26 PHP
php中curl和soap方式请求服务超时问题的解决
2018/06/11 PHP
Web开发者必备的12款超赞jQuery插件
2010/12/03 Javascript
通过JavaScript使Div居中并随网页大小改变而改变
2013/06/24 Javascript
jQuery实现响应鼠标滚动的动感菜单效果
2015/09/21 Javascript
自己动手写的javascript前端等待控件
2015/10/30 Javascript
动态的9*9乘法表效果的实现代码
2016/05/16 Javascript
JS获取随机数和时间转换的简单实例
2016/07/10 Javascript
jQuery实现的自定义滚动条实例详解
2016/09/20 Javascript
jQuery层级选择器实例代码
2017/02/06 Javascript
基于JavaScript实现的希尔排序算法分析
2017/04/14 Javascript
在vue中v-bind使用三目运算符绑定class的实例
2018/09/29 Javascript
Node.js 多线程完全指南总结
2019/03/27 Javascript
[56:46]2018DOTA2亚洲邀请赛 3.31 小组赛 B组 VP vs Effect
2018/04/01 DOTA
从零学python系列之新版本导入httplib模块报ImportError解决方案
2014/05/23 Python
Python httplib模块使用实例
2015/04/11 Python
Windows平台Python连接sqlite3数据库的方法分析
2017/07/12 Python
基于并发服务器几种实现方法(总结)
2017/12/29 Python
用python实现的线程池实例代码
2018/01/06 Python
Python 统计字数的思路详解
2018/05/08 Python
浅谈Python批处理文件夹中的txt文件
2019/03/11 Python
解决django服务器重启端口被占用的问题
2019/07/26 Python
css3的transform造成z-index无效解决方案
2014/12/04 HTML / CSS
移动端Html5中百度地图的点击事件
2019/01/31 HTML / CSS
以设计师精品品质提供快速时尚:PopJulia
2018/01/09 全球购物
如何利用find命令查找文件
2016/11/18 面试题
某科技软件测试面试题
2013/05/19 面试题
微笑服务演讲稿
2014/05/13 职场文书
企业2014年度工作总结
2014/12/10 职场文书
运动会通讯稿200字
2015/07/20 职场文书
工作会议简报
2015/07/20 职场文书
励志语录:你若不勇敢,谁替你坚强
2019/11/08 职场文书
php随机生成验证码,php随机生成数字,php随机生成数字加字母!
2021/04/01 PHP
MySql新手入门的基本操作汇总
2021/05/13 MySQL