使用jQuery蒙面问题插件

Question

这是我场面膜：

$('#Cellphone').mask("(99)9999-9999?9", { placeholder: " " }); 

1. 我要清除的面具，当我输入失去了重心。有没有办法做到这一点？类似插件的一个选项...

   $('#Cellphone').mask("(99)9999-9999?9", { 
       placeholder: " ", 
       clearOnLostFocus: true 
   }); 
   

   或成模糊函数：

   $('#Cellphone').blur(function() { 
       // clear the mask here. 
   }); 
   

2. 我要动态地改变我的面具。我使用这个功能，并且工作得很好...

   $('#Cellphone').keyup(function() { 
       var newValue = $(this).val() 
        .replace("(", "") 
        .replace(")", "") 
        .replace(" ", "") 
        .replace("-", "") 
        .replace("?", ""); 
   
       if (newValue.length > 10) { 
        $(this).mask("(99)9-9999-9999", { placeholder: " " }); 
       } 
   }); 
   

   但 ...当我按空格键与此字段中选择的内容，我的面具停止工作。任何想法为什么发生这种情况？

谢谢，伙计们！

Answer 1

clearOnLostFocus选项适用于未正确填充掩码的情况。即如果你有没有输入所有的数字，那么离开输入，它会清除它。

$('#cellphone').mask("(99)9999-9999?9", { placeholder: " ", clearOnLostFocus: true }); 

如果你失去焦点时要输入字段为空，即使当领域内的数字相匹配的面具，那么你需要使用一个blur事件。在事件回调，空场，并重新申请输入掩码：

$("#cellphone").blur(function() { 
    $(this).val(""); 
    $(this).mask("(99)9999-9999?9", { placeholder: " " }); 
}); 

原因退格或删除导致的问题是，因为该插件尝试新的面膜适用于文本行是不正确。因此，在你的键盘功能中，你需要检查新的掩码是否到位（输入字段的长度将是15），并且按下的键是退格键（code = 8）还是删除键（code = 46）。如果是这样，那么你需要重新应用旧的面具。

$('#cellphone').keyup(function (event) { 
    if ($(this).val().length > 14 && ((event.keyCode == 8)||(event.keyCode == 46))) { 
     $(this).mask("(99)9999-9999?9", { placeholder: " " }); 
    } else { 
      var newValue = $(this).val() 
       .replace("(", "") 
       .replace(")", "") 
       .replace(" ", "") 
       .replace("-", "") 
       .replace("?", ""); 

      if (newValue.length > 10) { 
       $(this).mask("(99)9-9999-9999", { placeholder: " " }); 
      } 
    } 
}); 

JSFiddle here以上所有。