首页 > Web开发 > 详细

jquery 多选框 全选

时间:2021-06-04 22:24:16      阅读:13      评论:0      收藏:0      [点我收藏+]

技术分享图片

 

 HTML

<table width="200px">
<tr>
<td><input type="checkbox" class="checkbox"></td>
<td>ID</td>
<td>名字</td>
</tr>
<tr>
<td><input type="checkbox" class="checkboxs"></td>
<td>1</td>
<td>张三</td>
</tr>
<tr>
<td><input type="checkbox" class="checkboxs"></td>
<td>1</td>
<td>李四</td>
</tr>
<tr>
<td><input type="checkbox" class="checkboxs"></td>
<td>1</td>
<td>王五</td>
</tr>
<tr>
<td><input type="checkbox" class="checkboxs"></td>
<td>1</td>
<td>赵六</td>
</tr>
<tr>
<td><input type="checkbox" class="checkboxs"></td>
<td>1</td>
<td>田七</td>
</tr>
<tr>
<td><input type="checkbox" class="checkboxs"></td>
<td>1</td>
<td>秦八</td>
</tr>
</table>

jquery
$(‘.checkbox‘).change(function () {
if($(‘.checkbox‘).prop(‘checked‘)){
$(‘.checkboxs‘).prop(‘checked‘,true);
}else{
$(‘.checkboxs‘).prop(‘checked‘,false);
}
})
$(‘.checkboxs‘).change(function () {
$x=0;
$(‘.checkboxs‘).each(function () {
$x++;
})
if($(‘.checkboxs:checked‘).length==$x){
$(‘.checkbox‘).prop(‘checked‘,true);
}else{
$(‘.checkbox‘).prop(‘checked‘,false);
}
})



jquery 多选框 全选

原文:https://www.cnblogs.com/aguo/p/14850986.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!