JQuery текстовое поле при расчете изменений

Question

У меня есть несколько флажков!Каждый раз, когда флажки отмечены, они автоматически суммируют общую стоимость:

<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();
    });
});

Answer 1

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);

Вызовите calculateSum изнутри onCheck, чтобы скидка рассчитывалась всегда.

Также упростили способ привязки обработчиков, поскольку создавались ненужные накладные расходы.

демо на http://jsfiddle.net/gaby/jZEUz/7/

Answer 2

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(parseFloat($("#t_balance").text())-sum.toFixed(2));
}
$("input[type=checkbox]").change(function() {
    onCheck();
});

$(":text").each(function() {
    $(this).keyup(function() {
        calculateSum();
    });
});

Answer 3

Является ли http://jsfiddle.net/8W92S/ тем, что вы ищете?

Answer 4

, если желаемое значение равно 55,00, в то время как пользователь установил флажок и введите 10 в текстовом поле, измените свою функцию calcSum следующим образом:

function calculateSum() {
    var sum = 0;
    $(":text").each(function() {
        if (!isNaN(this.value) && this.value.length != 0) {
            sum += parseFloat(this.value);
        }
    });
    $("#t_balance").html(($("#t_balance").html()-sum).toFixed(2));
}