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

发布于 2022-09-01 22:23:09 字数 1924 浏览 15 评论 0

最近在使用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);
    }
});

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(3

素衣风尘叹 2022-09-08 22:23:09

循环:

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

痴骨ら 2022-09-08 22:23:09

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

十级心震 2022-09-08 22:23:09

eval 。。。。。。。。。

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文