jQuery 输入掩码不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17573697/
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
jQuery Input Mask Not Working
提问by Andrew
I am trying to set up a donations page for people to give money to a non-profit and allow them to specify the uses of the money. I have it set up that it totals the amounts the giver puts in each field as they enter amounts. I am trying to add an input mask in each field, but it is just making my JavaScript crash and not do anything. Here is the code I currently have that works perfectly before any masks:
我正在尝试建立一个捐赠页面，供人们向非营利组织捐款并允许他们指定资金的用途。我已将其设置为总计捐赠者在输入金额时在每个字段中输入的金额。我试图在每个字段中添加一个输入掩码，但这只会使我的 JavaScript 崩溃而没有做任何事情。这是我目前拥有的在任何掩码之前都能完美运行的代码：
<script src="/js/jquery.js"></script>
<script type="text/javascript">
$(document).ready( function() {
var calcTot = function() {
var sum = 0;
$('.toTotal').each( function(){
sum += Number( $(this).val() );
});
$('#giveTotal').val( '$' + sum.toFixed(2) );
}
calcTot();
$('.toTotal').change( function(){
calcTot();
});
});
</script>
'toTotal' is the class name given to all the input boxes that need to be added up; that is also the class that needs a mask. 'giveTotal' is the id of the total field.
'toTotal' 是所有需要相加的输入框的类名；那也是需要面具的班级。'giveTotal' 是总字段的 ID。
I have tried several variations I have found on StackOverflow and other sites.
我尝试了在 StackOverflow 和其他网站上发现的几种变体。
Full Code:
完整代码：
<html>
<head>
<script src="/js/jquery.js"></script>
<script type="text/javascript">
$(document).ready( function() {
//This is one of the masking codes I attempted.
$('.toTotal').mask('9.99', {reverse: true});
//other options I have tried:
//$('.toTotal').mask('9.99');
//$('.toTotal').mask('0.00');
//$('.toTotal').inputmask('9.99');
//$('.toTotal').inputmask('mask', {'mask': '9.99'});
var calcTot = function() {
var sum = 0;
$('.toTotal').each( function(){
sum += Number( $(this).val() );
});
$('#giveTotal').val( '$' + sum.toFixed(2) );
}
calcTot();
$('.toTotal').change( function(){
calcTot();
});
//I have tried putting it here, too
});
</script>
<title>Addition</title>
</head>
<body>
<input type="text" class="toTotal"><br />
<input type="text" class="toTotal"><br />
<input type="text" class="toTotal"><br />
<input type="text" id="giveTotal">
</body>
</html>
采纳答案by Rob Willis
There is no masking library script referenced in the sample code. You need to download the Digital Bush Masked Input Plugin Scriptand copy it into your JS folder.
示例代码中没有引用屏蔽库脚本。您需要下载Digital Bush Masked Input Plugin 脚本并将其复制到您的 JS 文件夹中。
Then add following script reference after 'jquery.js' line:
然后在“jquery.js”行之后添加以下脚本引用：
<script src="/js/jquery.maskedinput.min.js"></script>
