2 位小数输入掩码答案

【问题标题】：2 decimal places inputmask2 位小数输入掩码
【发布时间】：2016-08-12 15:05:46
【问题描述】：

我正在使用RobinHerbots inputmask ，我怎样才能使22.30 或2.15 等小数点后两位？就像在输入掩码上设置的“货币”，但没有逗号（根据值长度自动生成）和货币符号。以下是我尝试过的sn-p，但不幸的是它们都不起作用，请问有什么帮助、建议、想法、线索、建议吗？

$(document).ready(function(){
  $(".decimal").inputmask('decimal',{rightAlign: true});
  $(".currency").inputmask('currency',{rightAlign: true  });
  $(".custom1").inputmask({ mask: "**[.**]", greedy: false, definitions: { '*': { validator: "[0-9]" } }, rightAlign : true });
  $(".custom2").inputmask({ 'alias' : 'decimal', rightAlign: true, 'groupSeparator': '.','autoGroup': true });
  $(".custom3").inputmask({ 'alias' : 'decimal', 'mask' : "**[.**]", rightAlign: true});
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.2.6/jquery.inputmask.bundle.min.js"></script>

<input type="text" class="decimal" /><br>
<input type="text" class="currency" /><br>
<input type="text" class="custom1" /><br>
<input type="text" class="custom2" /><br>
<input type="text" class="custom3" value="0" /><br>

【问题讨论】：

.toFixed(2) 试试这个
这应该是实时输入
你能创建一个现场演示吗？
@guradio：请查看我的更新帖子，其中包含我的 sn-ps。
我使用 "$(".decimal").inputmask({ 'alias': 'decimal', 'groupSeparator': ',', 'autoGroup': true, 'digits' : 2, 'digitsOptional': false, 'placeholder': '0.00', rightAlign : true,clearMaskOnLostFocus: !1 });"

标签： javascript jquery input-mask jquery-inputmask

【解决方案1】：

根据documentation，定义数字的正确语法是使用9 字符，因此在您的情况下，这将是99[.99]。试试这个：

$(document).ready(function() {
  $(".decimal").inputmask('decimal', {
    rightAlign: true
  });
  $(".currency").inputmask('currency', {
    rightAlign: true
  });
  $(".custom1").inputmask({
    mask: "99[.99]",
    greedy: false,
    definitions: {
      '*': {
        validator: "[0-9]"
      }
    },
    rightAlign: true
  });
  $(".custom2").inputmask({
    'alias': 'decimal',
    rightAlign: true,
    'groupSeparator': '.',
    'autoGroup': true
  });
  $(".custom3").inputmask({
    'alias': 'decimal',
    'mask': "99[.99]",
    rightAlign: true
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.2.6/jquery.inputmask.bundle.min.js"></script>

<input type="text" class="decimal" /><br>
<input type="text" class="currency" /><br>
<input type="text" class="custom1" /><br>
<input type="text" class="custom2" /><br>
<input type="text" class="custom3" value="0" /><br>

【讨论】：

谢谢，我使用 "$(".decimal").inputmask({ 'alias': 'decimal', 'groupSeparator': ',', 'autoGroup': true, 'digits': 2, 'digitsOptional': false, 'placeholder': '0.00', rightAlign : true,clearMaskOnLostFocus: !1 });"
我不明白为什么当我做$('.decimal').inputmask('decimal'); 时它不起作用。还有要导入的东西吗？
@John 如果没有看到您的代码，我真的无能为力。我建议开始您自己的问题，包括所有相关代码。

【解决方案2】：

如果您的系统是英文的，请使用此正则表达式：

$(".mask").inputmask('Regex', {regex: "^[0-9]{1,6}(\\.\\d{1,2})?$"});

如果您的系统是巴西葡萄牙语，请使用：

进口：

<script
        src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

    <script     src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mask/1.14.15/jquery.mask.min.js"></script>

    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.inputmask/3.2.6/jquery.inputmask.bundle.min.js"></script>

HTML：

<input class="mask" type="text" />

JS：

$(".mask").inputmask('Regex', {regex: "^[0-9]{1,6}(\\,\\d{1,2})?$"});

这是因为在巴西葡萄牙语中我们写“1.000.000,00”而不是像英语中的“1,000,000.00”，所以如果你使用“.”系统无法识别小数点。

就是这样，我希望它对某人有所帮助。我花了很多时间来理解它。

【讨论】：

【解决方案3】：

刚刚想出了一个无需 jQuery 或任何库的简单高效的方法：

HTML：

<input type="number" oninput="inputChange()" />

Javascript：

function inputChange(){
    let value = Number(document.activeElement.value);
    let pos = document.activeElement.selectionStart;
    document.activeElement.value = value.toFixed(2);

    document.activeElement.selectionStart = pos;
    document.activeElement.selectionEnd = pos;
}

我称它为西海岸压路机

【讨论】：