jQuery Input Mask Not Working

Я пытаюсь создать страницу пожертвований для людей, чтобы дать деньги некоммерческой организации и дать им возможность указать использование денег. Я установил, что он суммирует суммы, которые дающий вкладывает в каждое поле, когда они вводят суммы. Я пытаюсь добавить маску ввода в каждое поле, но это просто приводит к сбою JavaScript и ничего не делает. Вот код, который я в настоящее время, что отлично работает перед любыми масками:jQuery Input Mask Not Working

<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' - это идентификатор всего поля.

Я пробовал несколько вариантов, которые я нашел на 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>

источник

2013-07-10 Andrew

Можете ли вы предоставить код маски, которая вызывает ошибку? –

Как я уже сказал, я пробовал много разновидностей. Я надеялся, что это будет '$ ('. ToTotal'). Mask ('000,000.00', {reverse: true});'. Я также попробовал варианты, которые я нашел, что использовал '.inputmask', с и без' {reverse: true} 'и 9s вместо 0s. Я не знаю, могло ли место размещения быть проблемой. Моим первым вариантом было поместить этот код в строку перед 'var calcTot = function() {'. Я также попробовал его в конце готовой функции и в середине ее. – Andrew

Можете ли вы предоставить полный образец кода в вопросе, поскольку это невозможно ответить, не видя конкретной проблемы. Единственное решение, о котором я могу думать, не видя этого, это то, что скрипты Mask Plugin не включались. –

Там нет библиотеки маскирующего скрипта, указанного в примере коде. Вам необходимо загрузить Digital Bush Masked Input Plugin Script и скопировать его в папку JS.

Затем добавьте следующую ссылку скрипт после строки «jquery.js»:

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

источник

2013-07-10 16:11:58

Спасибо! Я знал, что это должно быть что-то невероятно маленькое, что мне не хватало. – Andrew

ответ

Смежные вопросы