In many website we have seen that on checked or unchecked one box
all the check box are checked or unchecked.
Now in this article i am showing how to checked unchecked all the check box
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$("#check_all").live("click",function(event)
{
if($("#check_all").hasClass('not_checked'))
{
$("#check_all").removeClass('not_checked');
$(".check-box").attr('checked',true);
}
else
{
$("#check_all").addClass('not_checked');
$(".check-box").attr('checked',false);
}
});
</script>
</head>
<body>
<table>
<tr>
<td>Select/Deselect</td>
<td><input type="checkbox" class="check-box not_checked" id="check_all"></td>
</tr>
<tr>
<td>First</td>
<td><input type="checkbox" class="check-box" id="check_box2"></td>
</tr>
<tr>
<td>Second</td>
<td><input type="checkbox" class="check-box" id="check_box3"></td>
</tr>
<tr>
<td>Third</td>
<td><input type="checkbox" class="check-box" id="check_box4"></td>
</tr>
</table>
</body>
</html>
In this setting checked attribute true/false alternatively by clicking on
select/deselect for alternate removing and adding class
not_checked depending upon that we are setting true and false
1 comments On Select/Deselect Multiple CheckBox Using Jquery
Pingback: 使用jQuery实现多复选框选择和取消选择 » Eric Lo ()