Javascript 2 位小数输入掩码
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/36735282/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
2 decimal places inputmask
提问by Juliver Galleto
I'm using RobinHerbots inputmask , How can I make 2 decimal places like 22.30
or 2.15
? like 'currency' set up on the inputmask but without commas (auto generated base on values length) and currency sign. Below is my snippet of what I've tried but unfortunately none of them works, any help, suggestions, ideas, clues, recommendations please?
我正在使用RobinHerbots inputmask,我怎样才能使 2 位小数,如22.30
或2.15
?就像在输入掩码上设置的“货币”一样,但没有逗号(根据值长度自动生成)和货币符号。以下是我尝试过的片段,但不幸的是它们都不起作用,有什么帮助、建议、想法、线索、建议吗?
$(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>
回答by Rory McCrossan
According to the documentationthe correct syntax for defining numeric figures is to use the 9
character, so in your case this would be 99[.99]
. Try this:
根据文档,定义数字的正确语法是使用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>
回答by Michel Fernandes
If your system is in English, use this regex:
如果您的系统是英文的,请使用以下正则表达式:
$(".mask").inputmask('Regex', {regex: "^[0-9]{1,6}(\.\d{1,2})?$"});
If your system is in Brazilian Portuguese, use this:
如果您的系统是巴西葡萄牙语,请使用以下命令:
Import:
进口:
<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:
HTML:
<input class="mask" type="text" />
JS:
JS:
$(".mask").inputmask('Regex', {regex: "^[0-9]{1,6}(\,\d{1,2})?$"});
Its because in Brazilian Portuguese we write "1.000.000,00" and not "1,000,000.00" like in English, so if you use "." the system will not understand a decimal mark.
因为在巴西葡萄牙语中我们写的是“1.000.000,00”而不是像英语中的“1,000,000.00”,所以如果你使用“.” 系统不会理解小数点。
It is it, I hope that it help someone. I spend a lot of time to understand it.
就是这样,我希望它可以帮助某人。我花了很多时间来理解它。
回答by story
Just came up with an easy and highly efficient method without jQuery or any libraries:
刚刚想出了一个简单高效的方法,无需 jQuery 或任何库:
HTML:
HTML:
<input type="number" oninput="inputChange()" />
Javascript:
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;
}
I call it the West Coast Steamroller
我称之为西海岸压路机