如何屏蔽除最后一位以外的所有内容

Question

我正在尝试使用 jquery 掩码来掩码除最后一位数字之外的所有内容，但我无法获得执行此操作的逻辑。以下是我到目前为止的尝试。

$(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 只接受一个数字作为该位置的输入。您需要在选项中添加自定义翻译，如 here 所述。

为了生成输入的新值，我将使用 String.replace() with a custom replacement function 将除最后一个字符外的所有字符替换为 *。

示例：

$(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>

如何屏蔽除最后一位以外的所有内容

How to mask everything except last digit

javascript

jquery

jquery-mask

示例：