實現的方法是從網上論壇看到的，然后根據自己情況寫來用的。table里面的checkbox選擇框是在html里面就寫好了，不是后期用js代碼插入進去的。效果預覽圖
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>table表格的選擇功能</title>
<!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<style>
table.table tr th,
td {
text-align: center;
cursor: pointer;
}
</style>
</head>
<body class="container">
<div class=".table-responsive">
<!--<button id="btn" class="btn btn-primary">按鈕</button>-->
<br>
<br>
<table id="" class="table table-hover table-bordered">
<thead>
<tr>
<th>
<input type="checkbox" name="" lay-skin="primary" lay-filter="allChoose">
</th>
<th>部門名稱</th>
<th>部門負責人</th>
<th>聯系電話</th>
<th>地址</th>
<th>操作列</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<input type="checkbox" name="html" lay-skin="primary" lay-filter="allChoose">
</td>
<td>信息部</td>
<td>張三</td>
<td>1395464646</td>
<td>XX市XX區</td>
<td>編輯</td>
</tr>
<tr>
<td>
<input type="checkbox" name="css" lay-skin="primary" lay-filter="allChoose">
</td>
<td>財務部</td>
<td>李四</td>
<td>1785454646</td>
<td>湖北省</td>
<td>添加</td>
</tr>
<tr>
<td>
<input type="checkbox" name="javascript" lay-skin="primary" lay-filter="allChoose">
</td>
<td>業務部</td>
<td>王五</td>
<td>13246231</td>
<td>湖南省</td>
<td>刪除</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
<script>
// $(function () {
// $("#btn").on('click', function () {
// var rows = $("table").find('tbody input[type="checkbox"]');
// console.log(rows);
// var ids = [];
// rows.each(function (item, index) {
// if (index.checked) {
// ids.push(index.name);
// }
// });
// console.log(ids);
// });
// });
$(function () {
checkBox();
function checkBox() {
var $thr = $("table thead tr"); //表格頭部的tr
var $checkAllTh = $("table thead tr").find('input').parent(); //表格頭部的的全選按鈕
var $tbr = $("table tbody tr"); //表格內容的tr
var $checkAll = $thr.find('input'); //表格頭部的全選框
//全選
$checkAll.click(function (event) {
//根據表格頭部（thead）的全選框的是否選中的狀態（true或false）來設置表格內容（tbody）的選擇框狀態
$tbr.find('input').prop('checked', $(this).prop('checked'));
if ($(this).prop('checked')) {
$tbr.find('input').parent().parent().addClass('danger');
} else {
$tbr.find('input').parent().parent().removeClass('danger');
}
//防止點擊事件向父元素冒泡 必須加阻止事件冒泡，不然會出現單擊全選框按鈕無作用的情況
event.stopPropagation();
});
//點擊表格頭部全選框所在的單元格時也觸發全選框的點擊操作
$checkAllTh.click(function () {
$(this).find('input').click();
});
//點擊表格內容（tbody）下面的每一行的選擇框
$tbr.find('input').click(function (event) {
//給選中和未選中，添加和刪除樣式
$(this).parent().parent().toggleClass('danger');
//判斷tbody里面的已經選中的input長度和表格內容本有的input長度是有相等，如果相等，則把theard的選擇框置為選中，
$checkAll.prop('checked', $tbr.find('input:checked').length == $tbr.find('input').length ?
true : false);
event.stopPropagation(); //防止點擊事件向父元素冒泡 必須加阻止事件冒泡，不然會出現單擊每一行內容的選框按鈕無作用的情況
});
//點擊tbody下面的每一行（非選擇框）也能觸發選擇框的點擊操作
$tbr.click(function () {
$(this).find('input').click();
});
}
})
</script>