全选或不选

html

<table class="table" width="100%" cellpadding="0" cellspacing="0">
<thead>
<tr class="lineTh">
<th width="30"><i class="checkIcon allCheckbox"></i></th>
<th>接警值班员</th>
<th>接警时间</th>
<th>接警类型</th>
<th>接警人姓名</th>
<th>接警人联系方式</th>
<th>船长</th>
<th>联系电话</th>
<th>船号</th>
<th>带队领导</th>
<th>出航时间</th>
<th>受理处置</th>
<th>移交</th>
<th>操作</th>
</tr>
</thead>
<tbody>
<tr>
<td><i class="checkIcon"></i></td>
<td>马涛</td>
<td>2017-12-12 09:56</td>
<td>纠纷</td>
<td>白泽郡</td>
<td>15678898889</td>
<td>秒永存</td>
<td>18798767789</td>
<td>苏赣渔0878</td>
<td>刘勇参谋长</td>
<td>2017-12-12 09:56</td>
<td>调解处理</td>
<td>渔政部门</td>
<td>
<a href="#" class="eye">查看</a>
<a href="#" class="edit">编辑</a>
<a href="#" class="delete">删除</a>
</td>
</tr>
<tr>
<td><i class="checkIcon"></i></td>
<td>马涛</td>
<td>2017-12-12 09:56</td>
<td>纠纷</td>
<td>白泽郡</td>
<td>15678898889</td>
<td>秒永存</td>
<td>18798767789</td>
<td>苏赣渔0878</td>
<td>刘勇参谋长</td>
<td>2017-12-12 09:56</td>
<td>调解处理</td>
<td>渔政部门</td>
<td>
<a href="#" class="eye">查看</a>
<a href="#" class="edit">编辑</a>
<a href="#" class="delete">删除</a>
</td>
</tr>
<tr>
<td><i class="checkIcon"></i></td>
<td>马涛</td>
<td>2017-12-12 09:56</td>
<td>纠纷</td>
<td>白泽郡</td>
<td>15678898889</td>
<td>秒永存</td>
<td>18798767789</td>
<td>苏赣渔0878</td>
<td>刘勇参谋长</td>
<td>2017-12-12 09:56</td>
<td>调解处理</td>
<td>渔政部门</td>
<td>
<a href="#" class="eye">查看</a>
<a href="#" class="edit">编辑</a>
<a href="#" class="delete">删除</a>
</td>
</tr>
<tr>
<td><i class="checkIcon"></i></td>
<td>马涛</td>
<td>2017-12-12 09:56</td>
<td>纠纷</td>
<td>白泽郡</td>
<td>15678898889</td>
<td>秒永存</td>
<td>18798767789</td>
<td>苏赣渔0878</td>
<td>刘勇参谋长</td>
<td>2017-12-12 09:56</td>
<td>调解处理</td>
<td>渔政部门</td>
<td>
<a href="#" class="eye">查看</a>
<a href="#" class="edit">编辑</a>
<a href="#" class="delete">删除</a>
</td>
</tr>
<tr>
<td><i class="checkIcon"></i></td>
<td>马涛</td>
<td>2017-12-12 09:56</td>
<td>纠纷</td>
<td>白泽郡</td>
<td>15678898889</td>
<td>秒永存</td>
<td>18798767789</td>
<td>苏赣渔0878</td>
<td>刘勇参谋长</td>
<td>2017-12-12 09:56</td>
<td>调解处理</td>
<td>渔政部门</td>
<td>
<a href="#" class="eye">查看</a>
<a href="#" class="edit">编辑</a>
<a href="#" class="delete">删除</a>
</td>
</tr>
<tr>
<td><i class="checkIcon"></i></td>
<td>马涛</td>
<td>2017-12-12 09:56</td>
<td>纠纷</td>
<td>白泽郡</td>
<td>15678898889</td>
<td>秒永存</td>
<td>18798767789</td>
<td>苏赣渔0878</td>
<td>刘勇参谋长</td>
<td>2017-12-12 09:56</td>
<td>调解处理</td>
<td>渔政部门</td>
<td>
<a href="#" class="eye">查看</a>
<a href="#" class="edit">编辑</a>
<a href="#" class="delete">删除</a>
</td>
</tr>
<tr>
<td><i class="checkIcon"></i></td>
<td>马涛</td>
<td>2017-12-12 09:56</td>
<td>纠纷</td>
<td>白泽郡</td>
<td>15678898889</td>
<td>秒永存</td>
<td>18798767789</td>
<td>苏赣渔0878</td>
<td>刘勇参谋长</td>
<td>2017-12-12 09:56</td>
<td>调解处理</td>
<td>渔政部门</td>
<td>
<a href="#" class="eye">查看</a>
<a href="#" class="edit">编辑</a>
<a href="#" class="delete">删除</a>
</td>
</tr>
<tr>
<td><i class="checkIcon"></i></td>
<td>马涛</td>
<td>2017-12-12 09:56</td>
<td>纠纷</td>
<td>白泽郡</td>
<td>15678898889</td>
<td>秒永存</td>
<td>18798767789</td>
<td>苏赣渔0878</td>
<td>刘勇参谋长</td>
<td>2017-12-12 09:56</td>
<td>调解处理</td>
<td>渔政部门</td>
<td>
<a href="#" class="eye">查看</a>
<a href="#" class="edit">编辑</a>
<a href="#" class="delete">删除</a>
</td>
</tr>
<tr>
<td><i class="checkIcon"></i></td>
<td>马涛</td>
<td>2017-12-12 09:56</td>
<td>纠纷</td>
<td>白泽郡</td>
<td>15678898889</td>
<td>秒永存</td>
<td>18798767789</td>
<td>苏赣渔0878</td>
<td>刘勇参谋长</td>
<td>2017-12-12 09:56</td>
<td>调解处理</td>
<td>渔政部门</td>
<td>
<a href="#" class="eye">查看</a>
<a href="#" class="edit">编辑</a>
<a href="#" class="delete">删除</a>
</td>
</tr>
<tr>
<td><i class="checkIcon"></i></td>
<td>马涛</td>
<td>2017-12-12 09:56</td>
<td>纠纷</td>
<td>白泽郡</td>
<td>15678898889</td>
<td>秒永存</td>
<td>18798767789</td>
<td>苏赣渔0878</td>
<td>刘勇参谋长</td>
<td>2017-12-12 09:56</td>
<td>调解处理</td>
<td>渔政部门</td>
<td>
<a href="#" class="eye">查看</a>
<a href="#" class="edit">编辑</a>
<a href="#" class="delete">删除</a>
</td>
</tr>
</tbody>
</table>

js

$(function(){
//全选或全不选

$(".allCheckbox").click(function() {
if ($(this).hasClass('checked')) {
$("tbody .checkIcon").removeClass('checked');
} else {
$(this).addClass('checked');
$("tbody .checkIcon").addClass('checked');
}
});
//设置全选复选框
$("tbody .checkIcon").click(function() {
$(this).toggleClass('checked');
allchk();

});

});
//设置全选复选框
function allchk() {

var chknum = $("tbody .checkIcon").size(); //选项总个数

var chk = $("tbody .checked").length;

if (chknum == chk) { //全选
$(".allCheckbox").addClass('checked');
} else { //不全选
$(".allCheckbox").removeClass('checked');
}
}

posted @   简单就好zyx  阅读(114)  评论(0编辑  收藏  举报
编辑推荐:
· Linux glibc自带哈希表的用例及性能测试
· 深入理解 Mybatis 分库分表执行原理
· 如何打造一个高并发系统?
· .NET Core GC压缩(compact_phase)底层原理浅谈
· 现代计算机视觉入门之:什么是图片特征编码
阅读排行:
· 手把手教你在本地部署DeepSeek R1,搭建web-ui ,建议收藏!
· Spring AI + Ollama 实现 deepseek-r1 的API服务和调用
· 数据库服务器 SQL Server 版本升级公告
· 程序员常用高效实用工具推荐,办公效率提升利器!
· C#/.NET/.NET Core技术前沿周刊 | 第 23 期(2025年1.20-1.26)
历史上的今天:
2014-12-27 ie兼容图片缩小后模糊失真(锯齿)问题
点击右上角即可分享
微信分享提示