jquery根据值长度更改输入掩码模板答案

【问题标题】：jquery Change input mask template based on value lengthjquery根据值长度更改输入掩码模板
【发布时间】：2017-09-23 10:29:27
【问题描述】：

我无法弄清楚如何根据值长度更改输入模板掩码。

例如：我有两个车号模板“99-999-99”和“999-99-999”。我需要根据值长度更改输入掩码。

如果值长度为 7 或更小，则模板必须为“99-999-99”。如果值长度大于 7，则寺庙必须为 '999-99-999'。

我的代码：

$("#carnum").keyup(()=>{
  var masks = ['99-999-99', '999-99-999'];
  var value = $('#carnum').val().replace(/-/g, '');
  value.length <= 7 ? -1 :  $('#carnum').mask(masks[1]);
})
$("#carnum").mask('99-999-99');

这里是fiddle。

谢谢！

【问题讨论】：

标签： javascript jquery validation user-interface input

【解决方案1】：

在再次屏蔽同一元素之前，最好先取消屏蔽，这是动态或有条件更改掩码的示例代码参考

var changeMask=0;
$("#carnum").keyup(()=>{
    var masks = ['99-999-99', '999-99-999'];
  var value = $('#carnum').val().replace(/-/g, '').replace(/_/g,''); 
  if(value.length==7){
  changeMask++;
  }
  if(changeMask>1&&value.length>=7) {
  $('#carnum').unmask(masks[0]); 
  $('#carnum').mask(masks[1]);
  var arrayValue=value.split("");
  $("#carnum").val("");
  for(var index=0;index<arrayValue.length;index++){
  $("#carnum").val(function(i, val) {
        return val + arrayValue[index];
    }).trigger('input');
  } 
  }
})
$("#carnum").mask('99-999-99');

Working fiddle here

【讨论】：