Question

我的HTML表单中包含此代码。

<?php foreach ($charges as $c): ?>
    <br><input type="checkbox" class="charge" id="charge<?php echo $c->id; ?>" data-cash="<?php echo $c->amount; ?>"> <?php echo $c->description; ?>
<?php } ?>

<div="total"></div>

当我勾选一个文本框时，我使用以下jQuery代码获取复选复选框的值。

$('.charge').change(function() {
    var v = $(this).data('cash');
    $('.total').html(v); 
});

// raise the event on checked elements on load:
$('.charge:checked').change();

但是，我应该得到复选框的所有值的总和并显示它们。此外，将某些值与另一个数字相乘，然后将其添加到已选中复选框中的其他值。

e.g Assume these are five checkboxes

1800
1200
2000 (if checked, multiply by 4)
3400
2000 (if checked, multiply by 4)

例如，如果从上到下检查前3个复选框，则显示的值应为1800然后是3000，然后，因为2000将乘以4，得到11000.（即1800 + 1200 + 8000）。如果未选中复选框，也应自动减去显示的值。

我如何实现这一目标？

Answer 1

您需要遍历已检查的项目，将它们总计

var $cs = $('.charge').change(function () {
    var v = 0;
    $cs.filter(':checked').each(function () {
        v += $(this).data('cash');
    })
    $('.total').html(v);
});

演示：Fiddle

没有循环的另一个选项是

var $cs = $('.charge').change(function () {
    var total = +$('.total').html().trim() || 0,
        v = $(this).data('cash');
    if (this.checked) {
        total += v
    } else {
        total -= v;
    }
    $('.total').html(total);
});

演示：Fiddle

如何在jQuery的循环中获取已检查复选框的值的总和

1 个答案: