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

方法一：

做项目的时候可能会遇到用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>

赞 (0)

相关推荐

  • js正则表达式中test,exec,match方法的区别说明

    js正则表达式中test,exec,match方法的区别说明 test test 返回 Boolean,查找对应的字符串中是否存在模式.var str = "1a1b1c";var reg = new RegExp("1.", "");alert(reg.test(str)); // true exec exec 查找并返回当前的匹配结果,并以数组的形式返回.var str = "1a1b1c";var reg = new R

  • js正则表达式之exec方法讲解

    功能说明:该函数通过对指定你的字符串进行一次匹配检测,获取字符串中的第一个与正则表达式的内容,并且将匹配的内容和子匹配的结果存放在返回数组中 基本方法:objReg.exec(string) objReg,RegExp对象的名称 string,要进行匹配的字符串 正则表达式exec()函数: exec() 方法用于检索字符串中的正则表达式的匹配. 返回值是一个数组,但是此数组的内容和正则对象是否是全局匹配有着很大关系: 1.没有g修饰符: 在非全局匹配模式下,此函数的作用和match()函数是一

  • JS正则表达式获取字符串中特定字符的方法

    实现的效果:在字符串中abcdefgname='test'sddfhskshjsfsjdfps中获取name的值test 实现的机制:通过replace的回调函数获取. 代码: 复制代码 代码如下: var str = "abcdefgname='test'sddfhskshjsfsjdfps"; var reg = /name='((\w|-|\s)+)/ig; str.replace(reg, function() { console.log(arguments.length);

  • 正则表达式语法规则及在Javascript和C#中的使用方法

    一.正则表达式概念: 在计算机科学中,是指一个用来描述或者匹配一系列符合某个句法规则的字符串的单个字符串.在很多文本编辑器或其他工具里,正则表达式通常被用来检索和/或替换那些符合某个模式的文本内容.许多程序设计语言都支持利用正则表达式进行字符串操作. 二.正则表达式的使用: 正则表达式在ASP.NET中主要是用来对输入的内容进行验证,验证一般分为两种一种是客户端JS验证,另一种是服务器端验证 1.JS对输入内容验证 复制代码 代码如下: function check() {           

  • js将字符串转成正则表达式的实现方法

    复制代码 代码如下: var str = "/abc/g"; var reg = eval(str); 就这么简单,用eval转一下.

  • JS正则表达式获取分组内容的方法详解

    支持多次匹配的方式: 复制代码 代码如下: var testStr = "now test001 test002";   var re = /test(\d+)/ig;    var r = "";   while(r = re.exec(testStr)) {       alert(r[0] + "  " + r[1]);   } 此外也可以用testStr.match(re),但是这样的话就不能有g的选项,而且只能得到第一个匹配. 另外备忘

  • JavaScript正则表达式下之相关方法

    JavaScript正则表达式下之相关方法

    上篇文章给大家介绍了JavaScript 正则表达式上之基本语法介绍了JavaScript正则表达式的语法,有了这些基本知识,可以看看正则表达式在JavaScript的应用了,在一切开始之前,看看RegExp实例的几个属性 RegExp实例对象有五个属性 1.global:是否全局搜索,默认是false 2.ignoreCase:是否大小写敏感,默认是false 3.multiline:多行搜索,默认值是false 4.lastIndex:是当前表达式模式首次匹配内容中最后一个字符的下一个位置,

  • JavaScript正则表达式验证身份证号码是否合法(两种方法)

    第一种方法: 在用户注册页面有些需求要求的比较严格,需要对身份证js验证是否合法,通过此功能严格此系统软件,从而过滤到很多水客.下面就此实现方法给大家讲解下. 很多时候我们都是通过一组正则表达式来判断用户输入的身份证是否合法,那在用正则表达式判断之前,你对身份证号的组成有多少了解呢?下面来说说一个身份证号里面包含了多少的信息: 1.号码的结构 公民身份号码是特征组合码,由十七位数字本体码和一位校验码组成.排列顺序从左至右依次为:六位数字地址码,八位数字出生日期码,三位数字顺序码和一位数字校验码.

  • JS使用replace()方法和正则表达式进行字符串的搜索与替换实例

    1.JS字符串的替换及replace()方法的使用 replace(regexp,replacement)方法有两个参数,第一参数可以是一个纯文本字符串或是一个RegExp对象,具体请看RegExp对象的使用:第二个参数可是一个字符串也可以是一个函数. 以下是JS字符串替换的举例: 例1: 复制代码 代码如下: var str="Hello world!";document.write(str.replace(/world/, "phper")); 例2: 复制代码

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

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

  • 浅析JS动态创建元素【两种方法】

    浅析JS动态创建元素【两种方法】

    前言: 创建元素有两种方法 1)将需要创建的元素,以字符串的形式拼接:找到父级元素,直接对父级元素的innnerHTML进行赋值. 2)使用Document.Element对象自带的一些函数,来实现动态创建元素(创建元素 => 找到父级元素 => 在指定位置插入元素) 一.字符串拼接形式 为了更好的理解,设定一个应用场景. 随机生成一组数字,将这组数据渲染为条形图的形式,放在div[id="container"]中,如下图 <div id="containe

  • JS动态创建元素的两种方法

    JS动态创建元素的两种方法

    本文为大家分享了js创建元素的两种方法供大家参考,具体内容如下 1)将需要创建的元素,以字符串的形式拼接:找到父级元素,直接对父级元素的innnerHTML进行赋值. 2)使用Document.Element对象自带的一些函数,来实现动态创建元素(创建元素 => 找到父级元素 => 在指定位置插入元素) 一.字符串拼接形式 为了更好的理解,设定一个应用场景. 随机生成一组数字,将这组数据渲染为条形图的形式,放在div[id="container"]中,如下图 <div

  • JS获取地址栏参数的两种方法(简单实用)

    js获取地址栏参数的方法有两种:第一种,采用正则表达式获取地址栏参数,第二种,是比较传统的方法,在这小编给大家强烈推荐使用第一种方法,既方便有实用,具体实现过程请看下文详述. 方法一:采用正则表达式获取地址栏参数:( 强烈推荐,既实用又方便!) function GetQueryString(name) { var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = window

  • vue 动态创建组件的两种方法

    vue 动态创建组件的两种方法

    Vue动态创建组件实例并挂载到body 方式一 import Vue from 'vue' /** * @param Component 组件实例的选项对象 * @param props 组件实例中的prop */ export function create(Component, props) { const comp = new (Vue.extend(Component))({ propsData: props }).$mount() document.body.appendChild(c

  • 基于Android在布局中动态添加view的两种方法(总结)

    一.说明 添加视图文件的时候有两种方式:1.通过在xml文件定义layout:2.java代码编写 二.前言说明 1.构造xml文件 2.LayoutInflater 提到addview,首先要了解一下LayoutInflater类.这个类最主要的功能就是实现将xml表述的layout转化为View的功能.为了便于理解,我们可以将它与findViewById()作一比较,二者都是实例化某一对象,不同的是findViewById()是找xml布局文件下的具体widget控件实例化,而LayoutI

  • vue-router之nuxt动态路由设置的两种方法小结

    方法一:router-link <div class="slide-item" v-for="user in shareData.users"> <nuxt-link :to="'/community/member/'+ user.id"> <img src="../../static/head.png" alt=""> <p>{{user.nickname}

  • js实现复制粘贴的两种方法

    本文实例为大家分享了js实现复制粘贴的具体代码,供大家参考,具体内容如下 一.前沿 界面需要复制功能,所以就写了一个作为简单记录 二.方法.推荐第二种. 1.第一种方法 1).通过 document.execCommand('copy') 2).前端代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>cons

  • c#动态调用Webservice的两种方法实例

    方法一: 复制代码 代码如下: Hashtable ht = new Hashtable();            ht.Add("a", "testhelloworld");            XmlDocument xx = WebServicesHelper.QuerySoapWebService("http://www.jb51.net/elab_mgmt/WorkflowSchemeTaskSerivce.asmx", "

  • js获取地址栏参数的两种方法

    项目中经常遇到获取上个页面跳转过来获取当前的参数 //获取地址栏参数,name:参数名称 function getUrlParms(name){ var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)"); var r = window.location.search.substr(1).match(reg); if(r!=null) return unescape(r[2]); return n

随机推荐