jQuery Eingabemaske funktioniert nicht

Ich versuche, eine Spendenseite für Menschen einzurichten, um Geld an eine gemeinnützige Organisation zu geben und ihnen zu erlauben, die Verwendung des Geldes zu spezifizieren. Ich habe es so eingerichtet, dass es die Beträge addiert, die der Geber in jedes Feld eingibt, wenn sie Beträge eingeben. Ich versuche, in jedem Feld eine Eingabemaske hinzuzufügen, aber es bringt nur mein JavaScript zum Absturz und macht nichts. Hier ist der Code, den ich zur Zeit haben, die perfekt vor allen Masken funktioniert:jQuery Eingabemaske funktioniert nicht

<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‘ ist der Klassenname für alle Eingabefelder gegeben, die addiert werden müssen; Das ist auch die Klasse, die eine Maske benötigt. 'giveTotal' ist die ID des gesamten Feldes.

Ich habe verschiedene Varianten ausprobiert, die ich auf StackOverflow und anderen Seiten gefunden habe.

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

Quelle

2013-07-10 Andrew

Können Sie den Maske Code, der den Fehler verursacht? –

Wie gesagt, ich habe viele Sorten ausprobiert. Der eine, den ich mir erhofft hatte, war '$ ('. ToTotal'). Mask ('000,000.00', {reverse: true});'. Ich habe auch Variationen ausprobiert, die ich gefunden habe und die '.inputmask' verwendet haben, mit und ohne' {reverse: true} 'und 9s anstelle von 0s. Ich weiß nicht, ob die Platzierung auch ein Problem gewesen sein könnte. Meine erste Option war, diesen Code in die Zeile vor 'var calcTot = function() {' zu setzen. Ich habe es auch am Ende der fertigen Funktion und in der Mitte davon versucht. – Andrew

Können Sie ein vollständiges Codebeispiel in der Frage bereitstellen, da es nicht möglich ist, zu antworten, ohne ein bestimmtes Problem zu sehen. Die einzige Lösung, die ich mir vorstellen kann, ist, dass die Masken-Plugin-Skripte nicht enthalten sind. –

Es gibt keine Maskierung Bibliothek Skript in dem Beispielcode verwiesen wird. Sie müssen die Digital Bush Masked Input Plugin Script herunterladen und in Ihren JS-Ordner kopieren.

Dann fügen Sie folgenden Skriptverweis nach ‚jquery.js‘ line:

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

Quelle

2013-07-10 16:11:58

Danke !! Ich wusste, dass es etwas unglaublich kleines sein musste, das ich vermisste. – Andrew

jQuery Eingabemaske funktioniert nicht

Antwort

Verwandte Themen