JQ实现表格全选

最新推荐文章于 2023-08-17 08:47:32 发布

qq_43568455

最新推荐文章于 2023-08-17 08:47:32 发布

阅读量328

点赞数

分类专栏： JAVAWEB

本文链接：https://blog.csdn.net/qq_43568455/article/details/103329960

版权

JAVAWEB 专栏收录该内容

11 篇文章 0 订阅

订阅专栏

JQ实现表格全选

$().attr(k,v)
语句把v的值赋给k


<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>使用jQuery完成复选框的全选和全不选</title>
		<script src="JQ/jquery-1.8.3.js"></script>
		<script type="text/javascript">
		$(function(){
			$("#选择").click(function(){
				$("tbody input").attr("checked",this.checked);
				
				
			})
			
		})
		
		
		
		</script>
	
	</head>
	<body>
		<table border="1" width="500" height="50" align="center" id="tbl" >
			<thead><!-- 表头-->
                  
				<tr>
					<td colspan="4">
						<input type="button" value="添加" />
						<input type="button" value="删除" />
					</td>
				</tr>
				<tr>
					<th><input type="checkbox" id="选择"></th>
					<th>编号</th>
					<th>姓名</th>
					<th>年龄</th>
				</tr>
			</thead>
			<tbody>
				<tr >
					<td><input type="checkbox" class="selectOne"/></td>
					<td>1</td>
					<td>张三</td>
					<td>22</td>
				</tr>
				<tr >
					<td><input type="checkbox" class="selectOne"/></td>
					<td>2</td>
					<td>李四</td>
					<td>25</td>
				</tr>
				<tr >
					<td><input type="checkbox" class="selectOne"/></td>
					<td>3</td>
					<td>王五</td>
					<td>27</td>
				</tr>
				<tr >
					<td><input type="checkbox" class="selectOne"/></td>
					<td>4</td>
					<td>赵六</td>
					<td>29</td>
				</tr>
			
				
			</tbody>
		</table>
	</body>
</html>

qq_43568455

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JQ实现表格全选

JQ实现表格全选$().attr(k,v)语句把v的值赋给k<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>使用jQuery完成复选框的全选和全不选</title> <script src="JQ/jquery-1.8.3.js...
复制链接

扫一扫

专栏目录