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 相关文章推荐
用js 让图片在 div或dl里 居中,底部对齐
Jan 21 Javascript
JSON.stringify 语法实例讲解
Mar 14 Javascript
Extjs中通过Tree加载右侧TabPanel具体实现
May 05 Javascript
AngularJS基础学习笔记之指令
May 10 Javascript
JS+CSS相对定位实现的下拉菜单
Oct 06 Javascript
JS中script标签defer和async属性的区别详解
Aug 12 Javascript
基于JavaScript实现鼠标箭头移动图片跟着移动
Aug 30 Javascript
JS实现浏览上传文件的代码
Aug 23 Javascript
浅谈webpack下的AOP式无侵入注入
Nov 12 Javascript
jQuery Ajax实现Select多级关联动态绑定数据的实例代码
Oct 26 jQuery
Electron vue的使用教程图文详解
Jul 05 Javascript
记一次vue跨域的解决
Oct 21 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
让PHP COOKIE立即生效,不用刷新就可以使用
2011/03/09 PHP
php实现字符串首字母大写和单词首字母大写的方法
2015/03/14 PHP
php中动态变量用法实例
2015/06/10 PHP
php生成高清缩略图实例详解
2015/12/07 PHP
使用PHP连接数据库_实现用户数据的增删改查的整体操作示例
2017/09/01 PHP
PHP生成随机数的方法总结
2018/03/01 PHP
Laravel框架控制器,视图及模型操作图文详解
2019/12/04 PHP
TP5框架实现自定义分页样式的方法示例
2020/04/05 PHP
javascript getElementsByName()的用法说明
2009/07/31 Javascript
javascript之学会吝啬 精简代码
2010/04/25 Javascript
THREE.JS入门教程(2)着色器-上
2013/01/24 Javascript
基于JavaScript 数据类型之Boolean类型分析介绍
2013/04/19 Javascript
从零学jquery之如何使用回调函数
2014/05/16 Javascript
浅谈javascript中的DOM方法
2015/07/16 Javascript
比例尺、缩略图、平移缩放之百度地图添加控件方法
2015/08/03 Javascript
jquery实现的淡入淡出下拉菜单效果
2015/08/25 Javascript
jQuery简单实现title提示效果示例
2016/08/01 Javascript
jquery获取input type=text中的值的各种方式(总结)
2016/12/02 Javascript
零基础轻松学JavaScript闭包
2016/12/30 Javascript
JS仿Base.js实现的继承示例
2017/04/07 Javascript
JointJS流程图的绘制方法
2018/12/03 Javascript
微信小程序tab切换可滑动切换导航栏跟随滚动实现代码
2019/09/04 Javascript
微信小程序网络请求实现过程解析
2019/11/06 Javascript
微信小程序开发(一):服务器获取数据列表渲染操作示例
2020/06/01 Javascript
Python 互换字典的键值对实例
2019/02/12 Python
python gdal安装与简单使用
2019/08/01 Python
解决Django中调用keras的模型出现的问题
2019/08/07 Python
python3.6生成器yield用法实例分析
2019/08/23 Python
Python实现串口通信(pyserial)过程解析
2019/09/25 Python
python多线程高级锁condition简单用法示例
2019/11/07 Python
Django认证系统user对象实现过程解析
2020/03/02 Python
Linux如何为某个操作添加别名
2013/03/01 面试题
求职简历推荐信范文
2013/12/02 职场文书
成本会计岗位职责
2015/02/03 职场文书
企业安全隐患排查治理制度
2015/08/05 职场文书
Python绘制散点图之可视化神器pyecharts
2022/07/07 Python