Jquery 动态输入字段中印度货币的输入掩码

Question

我想在输入框中输入时按照印度货币显示掩码。

我正在使用 InputMask jquery 进行屏蔽： https : //github.com/RobinHerbots/Inputmask

我希望无论用户尝试在文本输入中写下金额，它都应该根据印度货币格式添加自动逗号。

我试图通过使用以下代码来实现这一点。

<input type="text" name="amount" class="amount_field"/>
$('.amount_field').inputmask("numeric", {
            radixPoint: ".",
            groupSeparator: ",",
            digits: 3,
            autoGroup: true,
            prefix: '',
            rightAlign: false,
            allowMinus: false,
            // oncleared: function () { self.Value(''); }
        });

当前输出：2,500,000

所需输出：25,00,000

根据印度货币，我需要先昏迷 3 次，然后 2 次。

任何帮助都将得到认可。

Answer 1

我已经通过简单的以下操作解决了您的问题，您可以尝试一下。

注意：在最新版本的 InputMask 中添加了印度货币样式。 在此处查看最新版本。 : https://github.com/RobinHerbots/Inputmask/commit/5586f25853e96102417888b2cfc2823f3caa9763

<input type="text" class="inputmasking" value=""/>
<input type="text" class="inputmasking" value=""/>
<input type="text" class="inputmasking" value=""/>

<script type="text/javascript">
Inputmask("(,99){*|1}(,999){1|1}",
     {
         positionCaretOnClick: "radixFocus",
         _radixDance: true,
         radixPoint: ".",
         numericInput: true,
         placeholder: "0"
     }
 ).mask(".inputmasking");
</script>

小提琴的工作示例： https : //jsfiddle.net/mayanksdudakiya/58pnxjvw/

Answer 2

我创造了我自己的。 希望对你也有用。

 $(document).ready(function() { $(".amount_field, amount_field2").keyup(function() { convertToINRFormat($(this).val(),$(this)); }); convertToINRFormat($("#amount_field").val(),$("#amount_field")); convertToINRFormat($("#amount_field2").val(),$("#amount_field2")); }); function convertToINRFormat(value, inputField) { var number = Number(value.replace(/,/g, "")); // India uses thousands/lakh/crore separators $('#result').html(number.toLocaleString('en-IN')); $('#result1').html(number.toLocaleString('en-IN', { maximumFractionDigits: 2, style: 'currency', currency: 'INR' })); $(inputField).val(number.toLocaleString('en-IN')); }

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <input type="text" name="amount" class="amount_field" id="amount_field" value="123456789" /> <input type="text" name="amount" class="amount_field" id="amount_field2" value="987654321" /> <div id="result"></div> <div id="result1"></div>

Answer 3

var number = document.getElementsByClassName("amount_field")[0].value;
number.toLocaleString('en-IN');

Answer 4

我用 on change 事件解决了这个问题：

<input type="text" name="masknumber" id="masknumber" onchange="return changeData(this.value);">
<script type="text/javascript">
function changeData(x){
    alert(x);
    x=x.toString();
    var lastThree = x.substring(x.length-3);
    var otherNumbers = x.substring(0,x.length-3);
    if(otherNumbers != '')
    lastThree = ',' + lastThree;
    var res = otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") +  lastThree;
    document.getElementById('masknumber').value = res;
}
</script>