0

我将jQuery Masked Input Plugin与jQuery Validation Plugin一起使用。当表单的某个字段失去焦点时，jQuery Validation Plugin 会显示一条消息，但绑定到掩码的字段不会发生这种情况，可能是因为发生了 blur 事件并验证该字段不为空，实际上该字段已填写带着面具。

所以我重写了验证插件的所需方法，以便也验证掩码。由于我有电话掩码，因此我无法对掩码进行硬编码，因此我必须调用插件中的一个方法，该方法将绑定到该字段的掩码返回给我。我没有找到屏蔽输入插件的文档，也没有人遇到我的问题。

有谁知道是否有一种方法可以将绑定到该字段的掩码本身返回给我？

4

2 回答 2

1

我对电话字段使用屏蔽输入，并验证是否存在电话号码，minlength如下所示：

...

phone: {
    required:  true,
    minlength: 17
},

我的面具是这样的：

+1 (XXX) XXX-XXXX

于 2014-02-26T20:52:53.573 回答
0

鉴于插件（jQuery Masked Input Plugin）的构建方式，Tomanow 的方法是要走的路。

如果输入大小只能具有与掩码相同数量的字符。

我建议这种方法：

补充插件

(function($) {
$.fn.extend({

        mask2: function(mask, settings){
           //store in data
            this.data('data-mask',mask);
            this.data('data-maskLength', mask.length);

            //add data attributes as html markups (optional)
            this.attr('data-mask',mask);
            this.attr('data-maskLength', mask.length);

           // add validator rule (see section add custom method; i haven't test it yet you can remove it if necessary)

            $( "#myinput" ).rules( "add", {
               maskRule: true

            });

           // add original mask plugin
           return this.mask(mask, settings);
        }
});    
})(jQuery);

现在，您使用 mask2 而不是使用掩码

$("#date").mask2("99/99/9999");

添加自定义验证方法

最简单的方法是使用data-maskLengthkey ，（你可能需要把它放在上面）：

jQuery.validator.addMethod("maskRule", function(value, element, params) {

  return value.length == element.data("data-maskLength");
}

我没有测试验证方法，但至少你可以检索掩码或其长度

你可以看到我在JsFiddle上做了什么

于 2014-02-26T23:01:31.553 回答