获取选中和未选中的复选框值

Question

我有一些复选框，我需要获取值并计算新元素，但我需要它来计算何时被选中和何时未被选中。

<div id="dodaci">

<input name="checkboxes1" id="checkboxes-1" value="100" type="checkbox">
  <input name="checkboxes2" id="checkboxes-2" value="150" type="checkbox">
  <input name="checkboxes3" id="checkboxes-3" value="150" type="checkbox">
  <input name="checkboxes4" id="checkboxes-4" value="120" type="checkbox">
  <input name="checkboxes5" id="checkboxes-5" value="70" type="checkbox">
</div>

<div id="cena1">750<div>

cena1中的value需要加上checkbox的值，不勾选的时候需要取减？

这是我目前拥有的 jQuery

$(function() { 
    $('input[type="checkbox"]').bind('click',function() {
    $('#dodaci :checkbox:checked').each(function() {
    $('#cena1').append(', '+ $(this).val()); });
    });
});

Answer 1

我猜你需要类似下面的代码：

$(function() { 
$('input[type="checkbox"]').bind('click',function() {
    var value = parseInt($(this).val());
     var cenaNum = parseInt($('#cena1').text());
    if(this.checked){
         $('#cena1').text(value+cenaNum);          
    }
    else {
        $('#cena1').text(cenaNum-value);
    }    
});
});

这是小提琴的工作链接：

Demo : Jsfiddle link

Answer 2

使用$('#id:checked'); 它返回true 或false，所以不要将它绑定到each() 方法 id 我的意思是一个独特的ID，比如<input name="checkboxes1" id="checkboxes-1">

编辑

变化：

$('#cena1').append(', '+ $(this).val());

类似于：（没有测试！！）

if ($('#id:checked')) {
    $('#cena1')
        .append(
            parseInt($(this).text(), 10) + 
            parseInt($('#id:checked').val(), 10)
    );
} else {
    $('#cena1')
        .append(
            parseInt($(this).text(), 10) - 
            parseInt($('#id').not(':checked').val(), 10)
    );
}

编辑二

这与您的问题直接无关，但最好将inputs与其ID命名相同

所以不是：

<input name="checkboxes1" id="checkboxes-1">

但是：

<input name="checkboxes-1" id="checkboxes-1">