javascript - 提问:话说js可以动态生成function不?
天蓬老师
天蓬老师 2017-04-10 16:29:21
0
3
264

最近在使用jQuery.validate.js这个表单校验插件,由于有一些校验规则需要自己定义,查了一下,validate插件提供一个扩展方法供使用者添加自己的校验方法

jQuery.validator.addMethod( "方法名", function(value, element) {
        //一些处理。。。
}, "提示信息");

背景是这样的:
扩展方法中多半是使用正则表达式的方式来处理返回一个Boolean类型的值
像这样

var expression = /一段正则表达式/;
return this.optional(element) || (expression.test(value));

那么问题来了,情况是这样的
1.需要添加多条自定义的校验方法,并且都是以上的校验形式,就是说除了方法名,表达式,提示信息之外剩下都一样,像这样

       
jQuery.validator.addMethod("方法1", function(value, element) {
        var value = value.trim();
        var expression = /正则1/;
        return this.optional(element) || (expression.test(value));
}, "提示1");

jQuery.validator.addMethod("方法2", function(value, element) {
        var value = value.trim();
        var expression = /正则2/;
        return this.optional(element) || (expression.test(value));
}, "提示2");
...依此类推方法3,4,5,6...

2.(重点在这里)我看都一样就建了个json格式的变量,是一个由方法名,正则表达式,提示文字组成的对象的数组,然后用了一个for循环,循环的调用jQuery.validator.addMethod把三个参数传进去。

3.不知道是不是我错觉呀(应该不是),貌似这个动态生成function的取向不是很对,导致貌似所有生成的都是一个校验规则的

以上,我想知道问题出在哪里了,如果能解决的话需要怎么解决,提问完毕~

最后我把我的代码放在最下面。

var proofRules = [
    {
        name:"isGtZeroTwoDecimal",
        codex:/^(0|[1-9]\d*)(\.\d{1,2})?$/,
        msg:"请输入大于0的两位小数"
    },
    {
        name:"isAllDigit",
        codex:/^[0-9]*$/,
        msg:"只能输入数字"
    },
    {
        name:"isAllLetter",
        codex:/^[A-Za-z]+$/,
        msg:"只能输入字母"

    }
]

//添加jQuery -validate的扩展校验方法

$(function(){
    for (var i in proofRules){
        jQuery.validator.addMethod( proofRules[i].name, function(value, element) {
            var value = value.trim();
            var expression = proofRules[i].codex;
            return this.optional(element) || (expression.test(value));
        }, proofRules[i].msg);
    }
});
天蓬老师
天蓬老师

欢迎选择我的课程,让我们一起见证您的进步~~

membalas semua(3)
伊谢尔伦

循环:

[
  {m: "方法1", re: /正则1/, tip:"提示1"},
  {m: "方法2", re: /正则2/, tip:"提示2"},
  {m: "方法3", re: /正则3/, tip:"提示3"}
].forEach(function(o) {
  jQuery.validator.addMethod(o.m, function(value, element) {
    var value = value.trim();
    var expression = o.re;
    return this.optional(element) || (expression.test(value));
  }, o.tip);
})

helper:

addValidator("方法1", /正则1/, "提示1");
addValidator("方法2", /正则2/, "提示2");
addValidator("方法3", /正则3/, "提示3");

function addValidator(m, re, tip) {
  jQuery.validator.addMethod(m, function(value, element) {
    var value = value.trim();
    var expression = re;
    return this.optional(element) || (expression.test(value));
  }, tip);
}

至于为啥for不行,或者怎么样让for也行,这个无论是文章还是回答都在SF泛滥的不要不要的,自己找吧……

刘奇

你需要理解 JS 的作用域和闭包。参见:https://segmentfault.com/a/1190000000471569

小葫芦

eval 。。。。。。。。。

Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan
Tentang kita Penafian Sitemap
Laman web PHP Cina:Latihan PHP dalam talian kebajikan awam,Bantu pelajar PHP berkembang dengan cepat!