Question

我尝试在用户点击复选框时返回一些金额并进行一些计算。但是如果我尝试检查两个复选框，结果总是返回错误的值。

$('.type_checkbox input[type="checkbox"]').each(function (index) {

    if ($(this).is(':checked')) {
            checkbox_price_prefix = $(this).data('prefix-checkbox');
            checkbox_price = checkbox_price_prefix + $(this).data('price-checkbox');   // <----- += or =
    }
});

您可以尝试HERE

问题是当用户尝试检查类型A和类型B时，结果假设为RM90

Answer 1

你不是在意你 - 你正在取代它。改变：

checkbox_price = checkbox_price_prefix + $(this).data('price-checkbox');

要：

checkbox_price += parseFloat(checkbox_price_prefix + $(this).data('price-checkbox'));

Answer 2

问题是你要覆盖变量＆＃39;每次循环迭代中的值......

var checkbox_price = 0;
$('.type_checkbox input[type="checkbox"]').each(function (index) {
    if ($(this).is(':checked')) {
        checkbox_price += parseInt($(this).data('prefix-checkbox') + $(this).data('price-checkbox'),10);
    }
});

声明变量超出每个变量范围，然后使用已选中的收件箱的值增加其值将按您的意愿执行。

通过一些jQuery选择器优化：

var checkbox_price = 0;
$('.type_checkbox input[type="checkbox"]:checked').each(function (index) {
        checkbox_price += parseInt($(this).data('prefix-checkbox') + $(this).data('price-checkbox'),10);
});

Answer 3

这里有很多问题：

您正在覆盖总价值而不是将它们相加在一起
通过连接字符串-20和-，您无法获得值20。

您也不需要在每个循环上检查:checked。只需在选择器中包含它：

var optionCheckbox = function optionCheckbox() {
    var totalAdjustment = 0;

    $('.type_checkbox input[type="checkbox"]:checked').each(function () {
        var prefix = $(this).data('prefix-checkbox');
        var price = $(this).data('price-checkbox');
        totalAdjustment += prefix === '-' ? -price : +price;
    });

    return totalAdjustment ;
};

Answer 4

您的问题在于您的计算功能

 total = 100 + parseFloat(option_checkbox_return);

100必须声明为全局变量并初始化为100

var x=100;
var optionCheckbox = function optionCheckbox() {

    var checkbox_price_prefix;
    var checkbox_price = 0;
    // Loop Checkbox
    $('.type_checkbox input[type="checkbox"]').each(function (index) {

        if ($(this).is(':checked')) {
            checkbox_price_prefix = $(this).data('prefix-checkbox');
            checkbox_price = checkbox_price_prefix + $(this).data('price-checkbox');
        }
    });

    return checkbox_price;
}

    function calculateTotal() {

        var option_checkbox_return = optionCheckbox();

        total = x + parseFloat(option_checkbox_return);
        x=total;
        result = parseFloat(Math.round(total * 100) / 100).toFixed(2); // Convert to 2 decimal places
        $('.price_placeholder').html('RM' + result);

    }

$('.type_checkbox input[type="checkbox"]').on('click', function () {
    calculateTotal();
});

Javascript使用each（）为复选框返回正确的值

4 个答案: