Wie erhalten Sie die Gesamtsumme aus den Eingabefeldwerten mit Javascript?

Ich bin nicht perfekt in Javascript .. Ich möchte die Summe der Werte in Qty Eingabefelder in der nächsten Eingabebox namens Gesamt ohne Auffrischungsseite eingegeben werden. Kann mir jemand helfen, es herauszufinden ..?Wie erhalten Sie die Gesamtsumme aus den Eingabefeldwerten mit Javascript?

Hier ist Javascript

<script type="text/javascript"> 
var howmanytoadd = 2; 
var rows; 

function calc() { 
    var tot = 0; 
    for (var i = 0; i < rows.length; i++) { 
     var linetot = 0; 
     rows[i].getElementsByTagName('input')[howmanytoadd].value = linetot; 
     tot += linetot; 
    } 
    document.getElementById('total').value = tot 
} 
onload = function() { 
    rows = document.getElementById('tab').getElementById('qty1'); 
    for (var i = 0; i < rows.length; i++) { 
     rows.getElementsByTagName('input')[i].onkeyup = calc; 
    } 
} 
</script>

Hier ist mein HTML-Code:

Qty1 : <input type="text" name="qty1" id="qty"/><br> 
Qty2 : <input type="text" name="qty2" id="qty"/><br> 
Qty3 : <input type="text" name="qty3" id="qty"/><br> 
Qty4 : <input type="text" name="qty4" id="qty"/><br> 
Qty5 : <input type="text" name="qty5" id="qty"/><br> 
Qty6 : <input type="text" name="qty6" id="qty"/><br> 
Qty7 : <input type="text" name="qty7" id="qty"/><br> 
Qty8 : <input type="text" name="qty8" id="qty"/><br> 
<br><br> 
Total : <input type="text" name="total" id="total"/>

hier ist screen shot here is screen shot

Quelle

2012-11-24 Swapnil Bhavsar

@SwapnilBhavsar Ihren Code in der Frage statt eines Kommentars Put. – xdazz

Sie müssen also wissen, dass das 'id' Attribut in' HTML' eindeutig sein muss, dh Sie können es nicht in mehr als einem Element pro Seite verwenden. – Maroshii

ID muss eindeutig sein. Verwenden Sie unterschiedliche ID für jedes Textfeld –

Versuchen:

Qty1 : <input onblur="findTotal()" type="text" name="qty" id="qty1"/><br> 
Qty2 : <input onblur="findTotal()" type="text" name="qty" id="qty2"/><br> 
Qty3 : <input onblur="findTotal()" type="text" name="qty" id="qty3"/><br> 
Qty4 : <input onblur="findTotal()" type="text" name="qty" id="qty4"/><br> 
Qty5 : <input onblur="findTotal()" type="text" name="qty" id="qty5"/><br> 
Qty6 : <input onblur="findTotal()" type="text" name="qty" id="qty6"/><br> 
Qty7 : <input onblur="findTotal()" type="text" name="qty" id="qty7"/><br> 
Qty8 : <input onblur="findTotal()" type="text" name="qty" id="qty8"/><br> 
<br><br> 
Total : <input type="text" name="total" id="total"/> 


    <script type="text/javascript"> 
function findTotal(){ 
    var arr = document.getElementsByName('qty'); 
    var tot=0; 
    for(var i=0;i<arr.length;i++){ 
     if(parseInt(arr[i].value)) 
      tot += parseInt(arr[i].value); 
    } 
    document.getElementById('total').value = tot; 
} 

    </script>

Quelle

2012-11-24 11:52:19

Dank M8 funktioniert es ... –

;) ..................... –

Versuchen Sie folgendes:

function add() 
{ 
    var sum = 0; 
    var inputs = document.getElementsByTagName("input"); 
    for(i = 0; i <= inputs.length; i++) 
    { 
    if(inputs[i].name == 'qty'+i) 
    { 
    sum += parseInt(input[i].value); 
    } 
    } 
    console.log(sum) 

}

Quelle

2012-11-24 11:56:50

Javascript:

window.sumInputs = function() { 
    var inputs = document.getElementsByTagName('input'), 
     result = document.getElementById('total'), 
     sum = 0;    

    for(var i=0; i<inputs.length; i++) { 
     var ip = inputs[i]; 

     if (ip.name && ip.name.indexOf("total") < 0) { 
      sum += parseInt(ip.value) || 0; 
     } 

    } 

    result.value = sum; 
}

Html:

Qty1 : <input type="text" name="qty1" id="qty"/><br> 
Qty2 : <input type="text" name="qty2" id="qty"/><br> 
Qty3 : <input type="text" name="qty3" id="qty"/><br> 
Qty4 : <input type="text" name="qty4" id="qty"/><br> 
Qty5 : <input type="text" name="qty5" id="qty"/><br> 
Qty6 : <input type="text" name="qty6" id="qty"/><br 
Qty7 : <input type="text" name="qty7" id="qty"/><br> 
Qty8 : <input type="text" name="qty8" id="qty"/><br> 
<br><br> 
Total : <input type="text" name="total" id="total"/> 

<a href="javascript:sumInputs()">Sum</a>

Beispiel: http://jsfiddle.net/fRd9N/1/

Quelle

2012-11-24 12:00:56

Ich weiß, das ist eine ziemlich alte Frage, aber Stützen auf @Burlak llia. Das war genau das, was ich gerade brauche! –

Ich brauche die Spanne Elemente zusammenzufassen, damit ich bearbeitet Ak Hil Sekharans Antwort unten.

var arr = document.querySelectorAll('span[id^="score"]'); 
var total=0; 
    for(var i=0;i<arr.length;i++){ 
     if(parseInt(arr[i].innerHTML)) 
      total+= parseInt(arr[i].innerHTML); 
    } 
console.log(total)

Sie können die Elemente mit anderen Elementen ändern Link führt Sie mit der Bearbeitung.

https://www.w3.org/TR/css3-selectors/#attribute-substrings

Quelle

2016-05-13 08:49:35 Xenon

$(document).ready(function(){ 
 

 
\t \t //iterate through each textboxes and add keyup 
 
\t \t //handler to trigger sum event 
 
\t \t $(".txt").each(function() { 
 

 
\t \t \t $(this).keyup(function(){ 
 
\t \t \t \t calculateSum(); 
 
\t \t \t }); 
 
\t \t }); 
 

 
\t }); 
 

 
\t function calculateSum() { 
 

 
\t \t var sum = 0; 
 
\t \t //iterate through each textboxes and add the values 
 
\t \t $(".txt").each(function() { 
 

 
\t \t \t //add only if the value is number 
 
\t \t \t if(!isNaN(this.value) && this.value.length!=0) { 
 
\t \t \t \t sum += parseFloat(this.value); 
 
\t \t \t } 
 

 
\t \t }); 
 
\t \t //.toFixed() method will roundoff the final sum to 2 decimal places 
 
\t \t $("#sum").html(sum.toFixed(2)); 
 
\t }

body { 
 
\t \t \t \t font-family: sans-serif; 
 
\t \t \t } 
 
\t \t \t #summation { 
 
\t \t \t \t font-size: 18px; 
 
\t \t \t \t font-weight: bold; 
 
\t \t \t \t color:#174C68; 
 
\t \t \t } 
 
\t \t \t .txt { 
 
\t \t \t \t background-color: #FEFFB0; 
 
\t \t \t \t font-weight: bold; 
 
\t \t \t \t text-align: right; 
 
\t \t \t }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 

 
<table width="300px" border="1" style="border-collapse:collapse;background-color:#E8DCFF"> 
 
\t <tr> 
 
\t \t <td width="40px">1</td> 
 
\t \t <td>Butter</td> 
 
\t \t <td><input class="txt" type="text" name="txt"/></td> 
 
\t </tr> 
 
\t <tr> 
 
\t \t <td>2</td> 
 
\t \t <td>Cheese</td> 
 
\t \t <td><input class="txt" type="text" name="txt"/></td> 
 
\t </tr> 
 
\t <tr> 
 
\t \t <td>3</td> 
 
\t \t <td>Eggs</td> 
 
\t \t <td><input class="txt" type="text" name="txt"/></td> 
 
\t </tr> 
 
\t <tr> 
 
\t \t <td>4</td> 
 
\t \t <td>Milk</td> 
 
\t \t <td><input class="txt" type="text" name="txt"/></td> 
 
\t </tr> 
 
\t <tr> 
 
\t \t <td>5</td> 
 
\t \t <td>Bread</td> 
 
\t \t <td><input class="txt" type="text" name="txt"/></td> 
 
\t </tr> 
 
\t <tr> 
 
\t \t <td>6</td> 
 
\t \t <td>Soap</td> 
 
\t \t <td><input class="txt" type="text" name="txt"/></td> 
 
\t </tr> 
 
\t <tr id="summation"> 
 
\t \t <td>&nbsp;</td> 
 
\t \t <td align="right">Sum :</td> 
 
\t \t <td align="center"><span id="sum">0</span></td> 
 
\t </tr> 
 
</table>

Quelle

2016-06-17 11:15:23

Wie erhalten Sie die Gesamtsumme aus den Eingabefeldwerten mit Javascript?

Antwort

Verwandte Themen