印度货币的输入掩码在 Jquery 动态输入字段中
Input Masking for indian currency In Jquery dyanamic Input field
我想在输入框输入时按照印度货币显示掩码。
我正在使用 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。
我们将不胜感激。
var number = document.getElementsByClassName("amount_field")[0].value;
number.toLocaleString('en-IN');
我创建了自己的。希望对你也有用。
$(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>
我通过更改事件解决了这个问题:
<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>
我已经通过简单的操作解决了你的问题,你可以试试。
注意:在最新版本的 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>
fiddle 的工作示例: https://jsfiddle.net/mayanksdudakiya/58pnxjvw/
我想在输入框输入时按照印度货币显示掩码。
我正在使用 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。
我们将不胜感激。
var number = document.getElementsByClassName("amount_field")[0].value;
number.toLocaleString('en-IN');
我创建了自己的。希望对你也有用。
$(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>
我通过更改事件解决了这个问题:
<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>
我已经通过简单的操作解决了你的问题,你可以试试。
注意:在最新版本的 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>
fiddle 的工作示例: https://jsfiddle.net/mayanksdudakiya/58pnxjvw/