jquery实现全选、全不选以及单选功能
时间：2022-07-20 10:34:21 | 栏目：jquery | 点击：次
效果图：
代码如下：
<link rel="stylesheet" href="http://wiki.jikexueyuan.com/project/bootstrap4/dist/css/bootstrap.min.css" rel="external nofollow" >
<script src="https://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js">
</script>
<table class="table table-bordered ">
<thead class="tab_head">
<tr>
<td> <input type="checkbox" onclick="selectAll()"></td>
<th>角色名称</th>
<th>角色说明</th>
<th>所属系统</th>
</tr>
</thead>
<tbody>
<tr>
<td> <input type="checkbox"></td>
<td>系统管理员</td>
<td>管理员角色</td>
<td>武进公安平台</td>
</tr>
<tr>
<td> <input type="checkbox"></td>
<td>系统管理员</td>
<td>管理员角色</td>
<td>武进公安平台</td>
</tr>
<tr>
<td> <input type="checkbox"></td>
<td>系统管理员</td>
<td>管理员角色</td>
<td>武进公安平台</td>
</tr>
</tbody>
</table>
<script>
function selectAll(){
$("input[type='checkbox']").each( function() {
if($(this).prop("checked")==true) {
$("input[type='checkbox']").prop('checked', true);
return;
} else {
$("input[type='checkbox']").prop('checked', false);
return;
}
});
}
</script>