Question

我有一些复选框，其中所有数字都有不同的数字。

我想获取已检查的值，然后将这些数字加在一起，然后在我的div中显示结果。

<div id="pakker">
<input type="checkbox" value="39" />test 1<br/>
<input type="checkbox" value="79" />test 2<br/>
<input type="checkbox" value="29" />test 3<br/>
<input type="checkbox" value="49" />test 4<br/>
ect
</div>

到目前为止我所拥有的是：var pakker = $('#pakker checkbox:checked').val();

更新在哪里我想要结果：<h1 id="sk">0</h1>

但它并没有真正起作用，虽然我没有收到任何错误。

有没有人知道如何做到这一点，尽可能容易？

Answer 1

您可以使用attribute equals选择器选择复选框（您也可以使用:checkbox选择器，但速度较慢）。然后，您需要iterate检查已选中的复选框，并保持值的运行总计：

var total = 0;
$("#pakker input[type='checkbox']:checked").each(function() {
    total += parseInt(this.value, 10);
});
//Do whatever you like with total

这是working example。

Answer 2

您可以在此处查看该怎么做：http://jsfiddle.net/vaKWs/6/

更新为自动汇总值。

Answer 3

var result = 0;
$("#pakker input:checked").each(function(){ result += $(this).val(); });

alert(result );

Answer 4

如果您有幸不支持旧版浏览器（或shim reduce()）...

var sum = $('#pakker :checkbox:checked').map(function() {
   return parseInt(this.value, 10);
}).get().reduce(function(prev, current) {
    return prev + current;
}, 0);

jsFiddle

Answer 5

示例代码：

$(document).ready(function(){
        $("input[type='checkbox']").click(function(){
            var total = 0;
            $("#pakker input[type='checkbox']:checked").each(function() {
                total += parseInt(this.value, 10);
            });
            $('#result').html(total);
        });
    });

结果：

<span id="result"></span>
<div id="pakker">
<input type="checkbox" value="39" />test 1 - value 39<br/>
<input type="checkbox" value="79" />test 2 - value 79<br/>
<input type="checkbox" value="29" />test 3 - value 29<br/>
<input type="checkbox" value="49" />test 4 - value 49<br/>
ect
</div>

从复选框中获取值，添加它们并显示结果

5 个答案: