Warum, wenn ich ändere oder versuche, eine andere, andere Eingabeklasse hinzuzufügen, hört die Gesamtsumme auf zu arbeiten?

-2

Wenn ich versuche, eine Eingabeklasse in etwas anderes als val1 oder val2 zu ändern, funktioniert der gandTotal nicht mehr? Irgendwelche Ideen, warum das ist?Warum, wenn ich ändere oder versuche, eine andere, andere Eingabeklasse hinzuzufügen, hört die Gesamtsumme auf zu arbeiten?

ich das erste ändern möchten, und 3. Feld und fügen Sie eine if-Anweisung wie

if ($val1 <= 20) { $total = 0 } else { $total =$val1 * 1) * ($val2 * 1)-10);}

ein example

 <table> 

     <tr class="calcrow no1"> 
      <td> 
       <input name="txtEmmail" class="val1" /> 
      </td> 
      <td> 
       <input name="txtEmmail" class="val2" value="0.5"/> 
      </td> 
      <td> 
        <span class="multTotal">0.00</span> 
      </td> 
     </tr> 
     <tr class="calcrow no2"> 
      <td> 
       <input name="txtEmmail" class="val1" /> 
      </td> 
      <td> 
       <input name="txtEmmail" class="val2" value="49.5"/> 
      </td> 
      <td> 
        <span class="multTotal">0.00</span> 
      </td> 
     </tr> 
     <tr class="calcrow no3"> 
      <td> 
       <input name="txtEmmail" class="val1" /> 
      </td> 
      <td> 
       <input name="txtEmmail" class="val2" value="20"/> 
      </td> 
      <td> 
        <span class="multTotal">0.00</span> 
      </td> 
     </tr> 
     <tr class="calcrow no4"> 
      <td> 
       <input name="txtEmmail" class="val1" /> 
      </td> 
      <td> 
       <input name="txtEmmail" class="val2" value="49.5"/> 
      </td> 
      <td> 
        <span class="multTotal">0.00</span> 
      </td> 
     </tr> 

      <tr> 
    <td colspan="3" align="right"> 
     Grand Total#<span id="grandTotal">0.00</span> 
    </td> 
</tr> 
    </table> 

<script> 
    $(document).ready(function() { 
     $(".calcrow input").keyup(multInputs); 

     function multInputs() { 
      var mult = 0; 
      // for each row: 
      $(".calcrow ").each(function() { 
       // get the values from this row: 
       var $val1 = $('.val1', this).val(); 
       var $val2 = $('.val2', this).val();   
       var $total = ($val1 * 1) * ($val2 * 1)          
       $('.multTotal',this).text($total); 
       mult += $total; 
      }); 
      $("#grandTotal").text(mult); 
     } 

    }); 

    </script>

Quelle

2016-04-09 Wrest

, dass eine ungültige HTML-Struktur ist, so dass es nie funktioniert. '

' ist falsch. –

Erstellen Sie ein [MCVE] oder die Frage wird geschlossen. –

Ich habe einen Link hinzugefügt, um das Beispiel anzuzeigen – Wrest

Antwort

First off, können Namenskonventionen diskutieren.

mit dem gleichen Präfix

var $val1 = $('.val1');

Wo, wie Werte, nicht

var val1 = $('.val1').val();

Der Grund bringe ich anfangen:

Mit jQuery, Elementnamen werden in der Regel mit einem „$“, wie dies voran Ja, Sie können Dinge so benennen, wie Sie möchten, aber damit andere Ihren Code lesen und verstehen, erleichtern folgende Konventionen das Verständnis.

Als nächstes, wenn der Wert manipuliert werden soll, sollte er in einen numerischen Wert umgewandelt werden. So ist die letzte Anweisung oben sollte geworden:

var val1 = parseFloat($('.val1').val() || 0);

Die || 0 wandelt eine leere Zeichenfolge in dem Wert auf einen Null.

Jetzt ein ternary operator kann verwendet werden, um die Werte zu verarbeiten, wie man wollte:

var total = val1 <= 20 ? 0 : (val1 * 1) * (val2 * 1) - 10;

Schließlich wird ein .toFixed(2) den Text hinzugefügt abschneiden (nicht abrunden!) Die sichtbaren Werte.

$(document).ready(function() { 
    $(".calcrow input").keyup(multInputs); 

    function multInputs() { 
    var mult = 0; 
    // for each row: 
    $(".calcrow ").each(function() { 
     // get the values from this row: 
     var val1 = parseFloat($('.val1', this).val() || 0); 
     var val2 = parseFloat($('.val2', this).val() || 0); 
     var total = val1 <= 20 ? 0 : (val1 * 1) * (val2 * 1) - 10; 

     $('.multTotal, .sm8',this).text(total.toFixed(2)); 
     mult += total; 
    }); 
    $("#grandTotal").text(mult.toFixed(2)); 
    } 

});

Ich kann nicht alle Anforderungen verstanden haben, Sie zu treffen versuchen, aber versuchen Sie diese Demo hier: http://jsbin.com/jeqiki/edit?html,output

Quelle

2016-04-09 16:59:04 Mottie

danke mottie für die Zeit nehmen, ein paar Dinge zu erklären, sehr geschätzt. Ist es möglich, den ternären Operator auf einen ausgewählten Ausgang anzuwenden? als die, die du gezeigt hast, will ich nur für Ausgang 1 und ich möchte ein anderes für Ausgang 3 schaffen und lasse 2 und 3 so, wie sie sind? – Wrest

Vielen Dank für Ihre Hilfe Ich konnte es herausfinden – Wrest

nicht sicher, warum aber die.tofixed auf dieser Zeile $ ("# grandTotal"). text (mult.toFixed (2)); funktioniert nicht auf chrome kommt mit testcal.php: 85 Uncaught TypeError: total.toFixed ist keine Funktion – Wrest

<script> 
    $(document).ready(function() { 
     $(".calcrow input").keyup(multInputs); 

     function multInputs() { 
      var mult = 0; 
      // for each row: 
      $(".calcrow ").each(function() { 
       // get the values from this row: 
       var val1 = parseFloat($('.val1', this).val() || 0); 
       var val2 = parseFloat($('.val2', this).val() || 0); 
       var sm8 = parseFloat($('.sm8', this).val() || 0);  
       var vu = parseFloat($('.vu', this).val() || 0);  

       var total = (val1 * 1) * (val2 * 1); 

       var sm8T = sm8 <= 20 ? 0 : (sm8 * 1) * (val2 * 1)-10;  
       var vuT= vu <= 2 ? 0 : (vu * 1) * (val2 * 1)-40; 

       $('.vuT',this).text(vuT);         
       $('.sm8T',this).text(sm8T); 
       $('.multTotal',this).text(total.toFixed(2)); 

       mult += sm8T+vuT+total; 
      }); 
      $("#grandTotal").text(mult.toFixed(2)); 
     } 

    }); 

    </script>

Quelle

2016-04-09 18:22:01 Wrest

Verwandte Themen