2013-07-10 74 views
6

我正在嘗試設置一個捐贈頁面,讓人們可以將錢捐給非盈利組織,並允許他們指定錢的用途。我已經確定了它在總額中給出了投入者在每個領域投入的金額。我試圖在每個字段中添加一個輸入掩碼,但它只是讓我的JavaScript崩潰而沒有做任何事情。這是我目前擁有的代碼,任何掩蓋之前完美的作品:jQuery輸入掩碼不工作

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

你可以提供導致錯誤的屏蔽碼? –

+0

正如我所說我嘗試了很多品種。我希望能夠工作的是'$('。toTotal')。mask('000,000.00',{reverse:true});'。我也嘗試過使用'.inputmask',有和沒有'{reverse:true}',9s而不是0s的變體。我不知道安置是否也是一個問題。我的第一個選擇是將這個代碼放在'var calcTot = function(){'之前的行上。我也在ready函數結束時嘗試了它,並在它的中間嘗試了它。 – Andrew

+0

你能否提供一個完整的代碼示例,因爲如果沒有看到具體問題就無法回答。我能想到的唯一解決方案是沒有看到這個插件腳本沒有包含在內。 –

回答

7

有示例代碼引用毫無遮攔庫腳本。您需要下載Digital Bush Masked Input Plugin Script並將其複製到您的JS文件夾中。

然後加入後「的jquery.js」行下面的腳本參考:

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

謝謝!我知道它必須是令我難以置信的小事。 – Andrew