jquery - twitter bootstrap - 选中时获取复选框的值

Question

我有一个 div 里面有 3 个复选框。我想让所有这些都用 jQuery 串起来。 我正在使用这个主题http://almsaeedstudio.com/preview/ 表单中的复选框 --> 常规元素。 它改变了设计支票簿的 HTML，

div：

<div id="some_id">
<input type="checkbox" value="1">
<input type="checkbox" value="2">
<input type="checkbox" value="3">
</div>

jquery：

 $("#some_div input[type='checkbox']").on('ifChecked', function(event){
   arr='';
   $('div[aria-checked="true"]').find("input").each(function(){

      arr=arr+","+$(this).val();

});

 console.log(arr);
}); 

脚本有效，但我有 2 个问题：

1. 它没有得到刚刚被选中的复选框的值。例如：
   • 如果我选中 1，arr 将为空。
   • 如果我检查 1 和 2，arr 将是“,1”。
   • 如果我检查 1 2 3，arr 将是“,1,2”。
2. 如何在“未选中”时运行此脚本？

我试过了：

$("#some_div input[type='checkbox']").on('click', function(event){

它不适用于 bootstarp 复选框。这只是引导程序中的一个问题，在常规 html 中，通过“单击”获取值是没有问题的。

谢谢。

Answer 1

首先：更改- -> =

 <input type="checkbox" value="1">

第二：在输入框内更改name

 <input type="checkbox" value="1" name="checkgroup">
 <input type="checkbox" value="2" name="checkgroup">
 <input type="checkbox" value-"3" name="checkgroup">

第三：你可以给它一些ID方便访问：

 <input type="checkbox" id="checkbox1" value="1" name="checkgroup">

Forth：使用 jquery 随心所欲地处理它：

 $("#checkbox1").click('click', function(){.. /*do something*/ .. });

Answer 2

在处理复选框时，最好使用onChange。这是demo

试试这样的：

<div id="some_id">
    <input type="checkbox" value="1" name="checkgroup" />
    <input type="checkbox" value="2" name="checkgroup" />
    <input type="checkbox" value="3" name="checkgroup" />
</div>

JS：

$(document).ready(function () {
    $('input[type="checkbox"]', '#some_id').on('change', function () {
        var arr = '';
        $('input[type="checkbox"]:checked', '#some_id').each(function (i, ele) {
            if (arr.length > 0) {
                arr += ', ';
            }
            arr += $(ele).val();
        });

        console.log(arr);
    });
});