jQuery 输入掩码不起作用答案

【问题标题】：jQuery Input Mask Not WorkingjQuery 输入掩码不起作用
【发布时间】：2013-07-10 14:43:25
【问题描述】：

我正在尝试建立一个捐赠页面，供人们向非营利组织捐款，并允许他们指定资金的用途。我已将其设置为在提供者输入金额时将其汇总在每个字段中的金额。我试图在每个字段中添加一个输入掩码，但这只是让我的 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'是给所有需要相加的输入框的类名；那也是需要掩码的类。 'giveTotal' 是总字段的 id。

我尝试了几种在 StackOverflow 和其他网站上发现的变体。

完整代码：

<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>

【问题讨论】：

您能否提供导致错误的掩码代码？
正如我所说，我尝试了很多品种。我希望能起作用的是$('.toTotal').mask('000,000.00', {reverse: true});。我还尝试了我发现使用.inputmask 的变体，有和没有{reverse: true}，以及9s 而不是0s。我不知道安置是否也可能是一个问题。我的第一个选择是将此代码放在var calcTot = function() { 之前。我还在 ready 函数的末尾和中间尝试了它。
您能否在问题中提供完整的代码示例，因为如果没有看到特定问题就无法回答。我能想到的唯一解决方案是没有包含 Mask Plugin 脚本。

标签： javascript jquery maskedinput input-mask

【解决方案1】：

示例代码中没有引用屏蔽库脚本。您需要下载Digital Bush Masked Input Plugin Script 并将其复制到您的JS 文件夹中。

然后在 'jquery.js' 行之后添加以下脚本引用：

<script src="/js/jquery.maskedinput.min.js"></script>

【讨论】：

谢谢！！我知道它一定是我错过的非常小的东西。