Rumah  >  Soal Jawab  >  teks badan

javascript - 提问:话说js可以动态生成function不?

最近在使用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);
    }
});
天蓬老师天蓬老师2721 hari yang lalu241

membalas semua(3)saya akan balas

  • 伊谢尔伦

    伊谢尔伦2017-04-10 16:31:21

    循环:

    [
      {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泛滥的不要不要的,自己找吧……

    balas
    0
  • 怪我咯

    怪我咯2017-04-10 16:31:21

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

    balas
    0
  • 高洛峰

    高洛峰2017-04-10 16:31:21

    eval 。。。。。。。。。

    balas
    0
  • Batalbalas