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 相关文章推荐
JavaScript 的方法重载效果
Aug 07 Javascript
ExtJS的FieldSet的column列布局
Nov 20 Javascript
使用jQuery.wechat构建微信WEB应用
Oct 09 Javascript
基于JS实现类似支付宝支付密码输入框
Sep 02 Javascript
JS中判断null的方法分析
Nov 21 Javascript
jquery ui sortable拖拽后保存位置
Apr 27 jQuery
详解如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件
Jun 01 jQuery
js实现京东轮播图效果
Jun 30 Javascript
详解Vue webapp项目通过HBulider打包原生APP
Jun 29 Javascript
Angular使用cli生成自定义文件、组件的方法
Sep 04 Javascript
js逆向解密之网络爬虫
May 30 Javascript
VUE中setTimeout和setInterval自动销毁案例
Sep 07 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入门教程之面向对象的特性分析(继承,多态,接口,抽象类,抽象方法等)
2016/09/11 PHP
Js 获取当前日期时间及其它操作实现代码
2021/03/04 Javascript
基于JQuery的一句代码实现表格的简单筛选
2010/07/26 Javascript
parseInt parseFloat js字符串转换数字
2010/08/01 Javascript
提升你网站水平的jQuery插件集合推荐
2011/04/19 Javascript
JavaScript中的substr()方法使用详解
2015/06/06 Javascript
jQuery实现带幻灯的tab滑动切换风格菜单代码
2015/08/27 Javascript
jquery选择器简述
2015/08/31 Javascript
AngularJS实现表单手动验证和表单自动验证
2015/12/09 Javascript
详解jQuery UI库中文本输入自动补全功能的用法
2016/04/23 Javascript
bootstrap table表格使用方法详解
2017/04/26 Javascript
用node-webkit把web应用打包成桌面应用(windows环境)
2018/02/01 Javascript
手动用webpack搭建第一个ReactApp的示例
2018/04/11 Javascript
vue webpack打包后图片路径错误的完美解决方法
2018/12/07 Javascript
python魔法方法-属性转换和类的表示详解
2016/07/22 Python
Python爬虫DNS解析缓存方法实例分析
2017/06/02 Python
python判断字符串是否是json格式方法分享
2017/11/07 Python
python+opencv实现阈值分割
2018/12/26 Python
Python快速转换numpy数组中Nan和Inf的方法实例说明
2019/02/21 Python
Python 读取串口数据,动态绘图的示例
2019/07/02 Python
Python识别html主要文本框过程解析
2020/02/18 Python
解决pycharm中opencv-python导入cv2后无法自动补全的问题(不用作任何文件上的修改)
2020/03/05 Python
Flask缓存静态文件的具体方法
2020/08/02 Python
实例讲解CSS3中的box-flex弹性盒属性布局
2016/06/09 HTML / CSS
HTML5中5个简单实用的API
2014/04/28 HTML / CSS
Feelunique澳大利亚:欧洲的化妆品零售电商
2019/12/18 全球购物
美国最大和最受信任的二手轮胎商店:Bestusedtires.com
2020/06/02 全球购物
类如何去实现接口
2013/12/19 面试题
北大研究生linux应用求职信
2013/10/29 职场文书
小学生暑假感言
2014/02/06 职场文书
质检部经理岗位职责
2014/02/19 职场文书
2014年党员自我剖析材料
2014/10/07 职场文书
预备党员期盼十八届四中全会召开思想汇报
2014/10/17 职场文书
普通党员群众路线教育实践活动心得体会
2014/11/04 职场文书
动画电影《龙珠超 超级英雄》延期上映
2022/03/20 日漫
Oracle数据库事务的开启与结束详解
2022/06/25 Oracle