如何掩盖除最后一位数字外的所有内容

Question

我正在尝试使用jquery mask屏蔽除最后一位数字以外的所有内容，但我无法做到这一点。 以下是到目前为止我尝试过的。

 $(document).ready(function() { var options = { onKeyPress: function(value, event, currentField, options) { var fieldVal = currentField.val(); var star = ''; for (var i = 0; i < fieldVal.length - 1; i++) { star += '*'; } currentField.val(currentField.val().replace(/(.)(?!$)/g, star)); } } $('.phone').mask('00000', options); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.15/jquery.mask.js"></script> <div> <input type="text" class="phone" /> </div> 

Answer 1

您面临的问题与所应用的mask ，您正在使用00000 ，而0仅接受一个数字作为该位置的输入。 您将需要添加一个自定义的翻译，如提到这里 ，在选项。

为了生成输入的新值，我将使用String.replace（）和自定义替换函数将所有字符替换为* ，最后一个除外。

例：

 $(document).ready(function() { var options = { translation: {0: {pattern: /[0-9*]/}}, onKeyPress: function(val, evt, currField, options) { let newVal = val.replace(/./g, (m, o, str) => (o !== str.length - 1 ? '*' : m)); currField.val(newVal); } }; $('.phone').mask('00000', options); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.15/jquery.mask.js"></script> <div> <input type="text" class="phone" /> </div> 

Answer 2

我建议在这里使用简单的regex ，不需要jquery.mask 。

 $("input[name='phone']").keyup(function() { $(this).val($(this).val().replace(/[^\\d\\*]/g, '').replace(/\\d(?=\\d{1})/g,'*')); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div> <input type="text" class="phone" name="phone" /> </div>