Question

我有5到6组。所有组都有子类别。该组正在修复，但子类别来自数据库（动态）。我想在组名附近有一个按钮来检查并取消选中该组的复选框。

一个组的all复选框具有不同的名称和ID。

对于示例组1复选框的名称类似于a1，a2，a3，a4等。第2组复选框的名称如b1，b2，b3等。

HTML

<?php $i=0;foreach($subcat as $subcat){ $i++; ?>
<input type="checkbox" value="<?php echo $subcat['id']?>" name="a<?php echo $i;?>" id="a<?php echo $i;?>"> <?php echo $subcat['name']; ?>                           
<?php } ?>

我该怎么做。

Answer 1

在组下使用与子类别相同的类名复选框，并使用classname选中/取消选中一个组下的复选框。

例如 - group1复选框的checkAllCheckboxGroup1类，Group2复选框的checkAllCheckboxGroup2类等等。

取消选中第1组下的所有内容

$('.checkAllCheckboxGroup1').prop('checked', '');

检查Group1下的ALL

$（'。checkAllCheckboxGroup1'）。prop（'checked'，'checked'）;

Answer 2

这里我在onclick事件上添加了checkAll（）函数，它检查了相应组下的所有项目。

<!DOCTYPE html>
<html>

<head>
<title>WisdmLabs</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<style>
div{
display: inline-block;
border: 1px solid black;
padding: 5px;
}
</style>

</head>
<body>

<div id="group1">
Group1<button onclick="checkAll(this)">Check All</button>
<hr />
<form>
<input type="checkbox" name="a1" value=""unchecked>Item1<br>
<input type="checkbox" name="a2" value="">Item2<br>
<input type="checkbox" name="a3" value="">Item3<br>
</form>
</div>

<div id="group2">
Group2<button onclick="checkAll(this)">Check All</button>
<hr />
<form>
<input type="checkbox" name="a1" value="">Item1<br>
<input type="checkbox" name="a2" value="">Item2<br>
<input type="checkbox" name="a3" value="">Item3<br>
</form>
</div>


<div id="group3">
Group3<button onclick="checkAll(this)">Check All</button>
<hr />
<form>
<input type="checkbox" name="a1" value="">Item1<br>
<input type="checkbox" name="a2" value="">Item2<br>
<input type="checkbox" name="a3" value="">Item3<br>
</form>
</div>

<script>
/**
*Function to check all the items under respective group
*/
function checkAll(me){
	var divid = $(me).parent().attr('id');
	$("#" + divid).find("input").prop("checked", true);	
}

</script>

</body>
</html>

如果您需要任何修改或特殊要求，请在下面留言。

选中/取消选中所有复选框

2 个答案:

取消选中第1组下的所有内容

检查Group1下的ALL