JQuery Gesamtmenge der Eingabe

Ich versuche, die Gesamtmenge sowie Preis, kann nicht scheinen, um die Menge Teil zu arbeiten. Ich berechne die gesamten Kubikmeter sowie den Preis für jeden Kubikmeter. Vielen Dank im Voraus.JQuery Gesamtmenge der Eingabe

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="utf-8" /> 
<script 
    src="https://code.jquery.com/jquery-3.1.1.min.js" 
    integrity="sha256-hVVnYaiADRTO2PzUGmuLJr8BLUSjGIZsDYGmIJLv2b8=" 
    crossorigin="anonymous"></script> 
</head> 

<body> 


<div class="page"> 
<ul> 
    <li>Cubic Yards<span><input type="text" name="Quantity" value="" class="quantity"></span></li> 
    <li>Price <span><input type="text" name="Price" value="25.50" class="price"></span></li> 
    <li> Total <span><input type="text" name="Total" value="0.00" class="total"></span></li> 
</ul> 

<div id="foo"></div> 
<input type="submit" value="ADD MORE" class="button" id="click"> 
<ul> 
    <li>Total Cubic Yards:<input id="cubicYards" type="text" name="cubicYards" value="0"></li> 
    <li>Total Price:<input id="amount" type="text" name="totalPrice" value="0.00"></li> 
</ul> 
</div> 

<script> 
$(".page").on("change keyup keydown paste propertychange bind mouseover", function(){ 
    calculateSum(); 
    calculateQuantity(); 
}); 

// add fields 
$("#click").click(function() { 
$("#foo").append(
'<ul>' + '\n\r' + 
'<li>Cubic Yards <span><input type="text" name="Quantity" value="" class="quantity"></span></li>' + '\n\r' + 
'<li>Price <span><input type="text" name="Price" value="" class="price"></span></li>' + '\n\r' + 
'<li>Total <span><input type="text" name="Total" value="0.00" class="total"></span></li>' + '\n\r' + 
'</ul>' 
); 

$(".total").each(function() { 
    $(this).keyup(function(){ 
     calculateSum(); 

    }); 
}); 

$(".quantity").each(function() { 
    $(this).keyup(function(){ 
     calculateSum(); 

    }); 
}); 

}); 

// function  
function calculateSum() { 
var sum = 0; 
$(".total").each(function() { 
if(!isNaN(this.value) && this.value.length!=0) { 

    var quantity = $(this).closest("ul").find("input.quantity:text").val(); 
    var price = $(this).closest("ul").find("input.price:text").val(); 

    var subTot = (quantity * price); 

    $(this).val(subTot.toFixed(2)); 

    sum += parseFloat(subTot.toFixed(2)); 
    } 
}); 

    $('#amount').val(sum.toFixed(2)); 
} 




// function  
function calculateQuantity() { 
var sum = 0; 
$(".quantity").each(function() { 
if(!isNaN(this.value) && this.value.length!=0) { 

    var quantity = $(this).closest("ul").find("input.quantity:text").val(); 


    var subTot = (quantity); 

    $(this).val(subTot.toFixed(2)); 

    sum += parseFloat(subTot.toFixed(2)); 
    } 
}); 

    $('#cubicYards').val(sum.toFixed(2)); 
} 
</script> 


</body> 
</html>

Quelle

2016-11-25 Cole Lewis

Nicht, dass es Ihr Problem ist, aber einige Ihrer Selektoren sind ein wenig überflüssig. Zum Beispiel $ (this) .closes ("ul"). Find ("input.quantity: text"). Val(); anc wird durch $ (this) .closest ("ul") ersetzt. find (". menge"). val(); da es nur ein Objekt mit dieser Klasse gibt. – Bindrid

'subTot' wird als String abgerufen. Strings besitzen kein 'parseFloat()'. – josephting

Ihr var quantity Selektor scheint redundant. Habe ich recht, wenn ich annehme, dass Sie alle Ihre .quantity Felder zusammenfassen möchten? Wenn ja, verstehe ich nicht, warum Sie als erstes zum nächsten ul gehen müssen. Ich habe Ihre JS Bin

Im Grunde nur vereinfacht calculateQuantity Funktion dazu: erreichen

habe ich eine vereinfachte Version von dem, was ich denke, Sie versuchen,

function calculateQuantity() { 
    var sum = 0; 

    $(".quantity").each(function() { 
     var q = parseFloat($(this).val()); 

     if(!isNaN(q)) { 
      $(this).val(q.toFixed(2)); 
      sum += q; 
     } 
    }); 

    $('#cubicYards').val(sum.toFixed(2)); 
};

Sehen, ob das für Sie arbeitet.

Quelle

2016-11-25 03:36:22 irot

Sehr gut, danke –

JQuery Gesamtmenge der Eingabe

Antwort

Verwandte Themen