Jquery获取到div中checkbox中每一组的数量,该怎么解决
日期：2014-05-16 浏览次数：20427 次
Jquery获取到div中checkbox中每一组的数量
就是在一个div中有多个checkbox,checkbox有分组,我想知道如何去获取checkbox的分组数量和checkbox每一组中checkbox选中的个数.
注:不知道checkbox的组名.即name,只知道div的id,假设为:chkDiv
------解决方案--------------------
就是在一个div中有多个checkbox,checkbox有分组,我想知道如何去获取checkbox的分组数量和checkbox每一组中checkbox选中的个数.
注:不知道checkbox的组名.即name,只知道div的id,假设为:chkDiv
------解决方案--------------------
- JScript code
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script>
function test(){
$("#chkDiv :checkbox").each(function(){
console.log($(this).is(":checked"));
})
}
</script>
<div id="chkDiv">
<input type=checkbox />
<input type=checkbox />
<input type=checkbox />
<input type=button value="TEST" onclick="test();" />
</div>
------解决方案--------------------
$("#divid input[type='checkbox']")
从这里面去循环，同一组的name名字肯定是一样的吧。
放到数组里。
然后，再去判断每一组的checked是true还是false就知道了。
------解决方案--------------------
- JScript code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>无标题页</title>
<script src="jquery-1.7.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
var str = "";
var info = getChkInfo("divCheckBoxes");
str = "容器元素内有name的checkbox共有" + info.length +"组\n" ;
for(var i in info)
{
var obj = info[i];
str += "组名："+obj.name +", 组元素个数：" + obj.count +", 组中元素选中个数："+ obj.checkedCount +"\n";
}
alert(str);
});
function getChkInfo(id)
{
var result = {}, nameArr=[], groupArr = [];
var $obj = $("#"+id);
$obj.find(":checkbox").each(function(){
var $chk = $(this);
if( this.name != undefined && this.name!=null && this.name!="" && $.inArray(this.name,nameArr) == -1 ){
var single = {};
single.name = this.name;
single.count = $obj.find(":checkbox[name='"+ this.name +"']").length;
single.checkedCount = $obj.find(":checkbox[name='"+ this.name +"']:checked").length;
nameArr.push( this.name );
groupArr.push( single );
}
});
return groupArr;
}
</script>
</head>
<body>
<div id="divCheckBoxes">
第一组
<input name="chk1" type="checkbox" value="1" />1
<input name="chk1" type="checkbox" value="2" />2
<input name="chk1" type="checkbox" checked="checked" value="3" />3
<br />
第二组
<input name="chk2" type="checkbox" value="a" />a
<input name="chk2" type="checkbox" checked="checked" value="b" />b
<input name="chk2" type="checkbox" checked="checked" value="c" />c
<input name="chk2" type="checkbox" value="d" />d
</div>
</body>
</html>
------解决方案--------------------
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
