如何在“输入”字段上按需执行多个掩码

时间:2014-10-06 11:36:18

标签: jquery jquery-mask

Iam尝试使用jquery mask plugin对输入执行掩码,我需要做的是执行两个不同的掩码:

US ### - ### - ### - ### - ### - ###如果用户首先尝试键入某些数字,则必须应用此掩码。 (这里我指的是数字输入#)

但如果用户最初决定不输入任何数字,我希望在此之后让他输入任何类型的字母或unicod字符或数字(完全是任何字符)

我该如何进行这样的面具?

1 个答案:

答案 0 :(得分:2)

一种可能的解决方案可能是使用On-the-fly mask change <input type="text" class="US" maxlength="20" autocomplete="off"/> 中所谓的内容,如下所示:

<强> HTML

$(document).ready(function(){
    var options =  {onKeyPress: function(us){
        var masks = ['CAAAA-AAA-AAA-AAA-AAA-AAA', 'US000-000-000-000-000-000'];
        if(us.length){
            mask = (us[0].match(/\d/)) ? masks[1] : masks[0];
            $('.US').mask(mask, this);
        }
        $('.US').mask('AAAAA-AAA-AAA-AAA-AAA-AAA', this);
    }};

    $('.US').mask('AAAAA-AAA-AAA-AAA-AAA-AAA', options);
});

<强>的jQuery

S: Only A-Z and a-z characters.

<强>解释

您输入的问题是它使用了字符S.虽然,S在插件中已经有不同的含义。根据默认面具图例:

var custom_options = {
  byPassKeys: [8, 9, 37, 38, 39, 40],
  translation: {
                '0': {pattern: /\d/}, 
                '9': {pattern: /\d/, optional: true}, 
                '#': {pattern: /\d/, recursive: true}, 
                'A': {pattern: /[a-zA-Z0-9]/}, 
                'S': {pattern: /[a-zA-Z]/}
            };
};

所以你有两个选择来解决这个问题:使用翻译模式,或覆盖“jquery.mask.js”中的默认选项:

{{1}}

我选择第二个!我用“C”改变了'S'。它可能是另一个角色。

点击此链接the jQuery Mask Plugin's doc查看一个有效的示例。

希望它有用!