效果:
- 点击最上面的全选按钮,下面4个checkbox被选中
- 下面四个按钮都选了则上面的全选按钮自动选上,下面只有一个没选,全选按钮都不选
代码:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>表格全选反选</title>
<style type="text/css">
*{
padding: 0;
margin: 0;
}
table{
width: 300px;
border-collapse: collapse;
border: 1px solid #666666;
}
thead{
width: 300px;
height: 50px;
color: #fff;
background: #008dd0;
}
thead th,td