Question

我在我的应用程序中使用了jQuery Masking插件。

这里给出了链接。

https://github.com/digitalBush/jquery.maskedinput

我需要像动态屏蔽一样。

有时我需要像这样使用 000-00-0 0000000-00-0

假设我写了50000然后它会变成50-00-0

假设我写了500000然后它会变成500-00-0

所以我的第一部分将包含1到7个不同的数字。

所以我怎么能做到这一点。

我在下面使用简单的屏蔽。

$("input[name='mask']").mask("9999999-99-9");

解决方案

var my_condition = true;
    $("input[name='mask']").on('click focus', function(){ 
       $("input[name='mask']").unmask();
       my_condition = true;
    });  
    $("input[name='mask']").on('change paste', function() {
        var len = $(this).val().length;
            if(my_condition) {
             switch(len) {
                 case 5:
                     $("input[name='mask']").mask('99-99-9');
                     break;
                 case 6:
                     $("input[name='mask']").mask('999-99-9');
                     break;
                 case 7:
                     $("input[name='mask']").mask('9999-99-9');
                     break;
                 case 8:
                     $("input[name='mask']").mask('99999-99-9');
                     break;
                 case 9:
                     $("input[name='mask']").mask('999999-99-9');
                     break;
                 case 10:
                     $("input[name='mask']").mask('9999999-99-9');
                     break;
                 default:
                      $("input[name='mask']").mask('9999');   
             }
             my_condition = false;
         }
    });

由于

Answer 1

我写了一篇简单的JSFiddle来演示如何解决这个问题。

这是我的JS代码：

$("#input").change(function(){
 var len = $(this).val().length;


if(len == 4)
    $(this).mask('99-99');
else if (len == 5)
  $(this).mask('999-99');
else if (len == 6)
  $(this).mask('9-99999');
})

$("#input").focus(function(){
 var val = $(this).val().replace("-",""); //remove the dashes from the old masked value
 $(this).mask("9999999999"); //set to maximum length
 $(this).val(val);
})

.mask()的问题在于它为输入字段设置了最大长度，这意味着如果设置了掩码"99-99"，则输入中不能写入4位以上field。我的解决方案是在输入聚焦时将掩码设置为"9999999999"，然后在更改值后设置正确的掩码。您必须更改change()（偶然双关语）事件才能满足您的需求。

实施缺陷：用户在输入时无法看到掩码

jQuery动态屏蔽

1 个答案: