我有几个复选框!每次选中复选框时,它都会自动总结总成本:
<input type="checkbox" rel="90" alt="30.00">Pearl or White
<input type="checkbox" rel="120" alt="35.00">Natural
<div id="t_balance"></div>
jquery计算总价
function onCheck(){
var t_balance = 0;
$("input[type=checkbox]:checked").each(function() {
t_balance += parseFloat($(this).attr("alt")); });
$("#t_balance").html(t_balance.toFixed(2));
}
function calculateSum() {
var sum = 0;
$(":text").each(function() {
if(!isNaN(this.value) && this.value.length!=0) {
sum += parseFloat(this.value);
}
});
$("#t_balance").html(sum.toFixed(2));
}
$("input[type=checkbox]").change(function() {onCheck(); });
现在,文本输入 1 折扣:
<input type="text" id="discount" />
我希望总价从折扣文本输入中扣除价格。上面的代码基本上将替换总价,从复选框到文本输入。
$(":text").each(function() {
$(this).keyup(function(){
calculateSum();
});
});
完整代码http://jsfiddle.net/boyee007/jZEUz/ :
function onCheck() {
var t_balance = 0;
$("input[type=checkbox]:checked").each(function() {
t_balance += parseFloat($(this).attr("alt"));
});
$("#t_balance").html(t_balance.toFixed(2));
}
function calculateSum() {
var sum = 0;
$(":text").each(function() {
if (!isNaN(this.value) && this.value.length != 0) {
sum += parseFloat(this.value);
}
});
$("#t_balance").html(sum.toFixed(2));
}
$("input[type=checkbox]").change(function() {
onCheck();
});
$(":text").each(function() {
$(this).keyup(function() {
calculateSum();
});
});
最佳答案
function onCheck() {
var t_balance = 0;
$("input[type=checkbox]:checked").each(function() {
t_balance += parseFloat($(this).attr("alt"));
});
$("#t_balance").html(t_balance.toFixed(2));
calculateSum();
}
function calculateSum() {
var sum = parseFloat( $("#t_balance").text() );
$(":text").each(function() {
if (!isNaN(this.value) && this.value.length != 0) {
sum -= parseFloat(this.value);
}
});
$("#t_balance").html(sum.toFixed(2));
}
$("input[type=checkbox]").change(onCheck);
$(":text").keyup(onCheck);
从 onCheck
内部调用 calculateSum
以使折扣始终得到计算。
还简化了绑定(bind)处理程序的方式,因为您创建了不需要的开销。
关于javascript - jQuery 文本框更改计算,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5487225/