jQuery Calculation Rechner Problem... Javascript...
ich kenn mich nicht wirklich mit Javasript aus.... ich brauch für eine Website einen kleinen Rechner der einige Objekte mit Anzahl auswahl zusammen rechnet und die Summe jedes einzelnen und die Gesamtsumme aller Objekte ausgibt und dann noch die Gesamtsumme aller Objekte mit 2,45 Multipliziert.
Ich hab mir dazu jQuery Calculation Plug-in ( jQuery Calculation Plug-in) Heruntergeladen und versucht mir den Rechner zu bauen, hat alles geklapt bis auf den letzten Punkt, dass ich nicht weiß wie ich in der Spalte grandTotal2 das Ergebnis aus grandTotal mit 2,45 Multiplizieren kann... ich hoffe das mir jemand helfen kann.
HTML-Code:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>jQuery Calculation Plug-in</title>
<!---// load jQuery v1.3.1 from the GoogleAPIs CDN //--->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<!--// load jQuery Plug-ins //-->
<script type="text/javascript" src="http://www.pengoworks.com/workshop/jquery/calculation/jquery.calculation.js"></script>
<script type="text/javascript">
var bIsFirebugReady = (!!window.console && !!window.console.log);
$(document).ready(
function (){
// update the plug-in version
$("#idPluginVersion").text($.Calculation.version);
/*
$.Calculation.setDefaults({
onParseError: function(){
this.css("backgroundColor", "#cc0000")
}
, onParseClear: function (){
this.css("backgroundColor", "");
}
});
*/
// bind the recalc function to the quantity fields
$("input[name^=qty_item_]").bind("keyup", recalc);
// run the calculation function now
recalc();
// automatically update the "#totalSum" field every time
// the values are changes via the keyup event
$("input[name^=sum]").sum("keyup", "#totalSum");
// automatically update the "#totalAvg" field every time
// the values are changes via the keyup event
$("input[name^=avg]").avg({
bind:"keyup"
, selector: "#totalAvg"
// if an invalid character is found, change the background color
, onParseError: function(){
this.css("backgroundColor", "#cc0000")
}
// if the error has been cleared, reset the bgcolor
, onParseClear: function (){
this.css("backgroundColor", "");
}
});
// automatically update the "#minNumber" field every time
// the values are changes via the keyup event
$("input[name^=min]").min("keyup", "#numberMin");
// automatically update the "#minNumber" field every time
// the values are changes via the keyup event
$("input[name^=max]").max("keyup", {
selector: "#numberMax"
, oncalc: function (value, options){
// you can use this to format the value
$(options.selector).val(value);
}
});
// this calculates the sum for some text nodes
$("#idTotalTextSum").click(
function (){
// get the sum of the elements
var sum = $(".textSum").sum();
// update the total
$("#totalTextSum").text("$" + sum.toString());
}
);
// this calculates the average for some text nodes
$("#idTotalTextAvg").click(
function (){
// get the average of the elements
var avg = $(".textAvg").avg();
// update the total
$("#totalTextAvg").text(avg.toString());
}
);
}
);
function recalc(){
$("[id^=total_item]").calc(
// the equation to use for the calculation
"qty * price",
// define the variables used in the equation, these can be a jQuery object
{
qty: $("input[name^=qty_item_]"),
price: $("[id^=price_item_]")
},
// define the formatting callback, the results of the calculation are passed to this function
function (s){
// return the number as a dollar amount
return s.toFixed(2) + "€";
},
// define the finish callback, this runs after the calculation has been complete
function ($this){
// sum the total of the $("[id^=total_item]") selector
var sum = $this.sum();
$("#grandTotal").text(
// round the results to 2 digits
sum.toFixed(2) + "€"
);
}
);
}
</script>
</head>
<body>
<table width="500">
<col style="width: 50px;" />
<col />
<col style="width: 60px;" />
<col style="width: 110px;" />
<tr>
<th width="15" align="left">
Anzahl
</th>
<th width="140" align="left">
Produkt
</th>
<th width="140" align="right">
Preis
</th>
<th width="180" align="right">
Preis Total
</th>
</tr>
<tr>
<td align="left">
<input type="text" name="qty_item_1" id="qty_item_1" value="0" size="2" />
</td>
<td>
<a>Stuhl</a>
</td>
<td align="right" id="price_item_1">
19.25 €
</td>
<td align="right" id="total_item_1">
19.25 €
</td>
</tr>
<tr>
<td align="left">
<input type="text" name="qty_item_2" id="qty_item_2" value="0" size="2" />
</td>
<td>
<a>Sofa</a>
</td>
<td align="right" id="price_item_2">
1400.00 €
</td>
<td align="right" id="total_item_2">
1400.00 €
</td>
</tr>
<tr>
<td align="left">
<input type="text" name="qty_item_3" id="qty_item_3" value="0" size="2" />
</td>
<td>
<a>Schrank</a>
</td>
<td align="right" id="price_item_3">
200.25 €
</td>
<td align="right" id="total_item_3">
200.25 €
</td>
</tr>
<tr>
<td colspan="3" align="right">
<strong>Grand Total:</strong>
</td>
<td align="right" id="grandTotal">
</td>
</tr>
<tr>
<td colspan="3" align="right">
<strong>Grand Total2:</strong>
</td>
<td align="right" id="grandTotal2">
</td>
</tr>
</table>
</body>
</html>
|
