如何掩蓋除最后一位數字外的所有內容

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>