这里给大家推荐一款免费迭代 二开便捷的商城项目:源码直通车>>>
话不多说 直接上实例
javascript"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<input type='button' value="全选" onclick="checkall()">
<input type='button' value="反选" onclick="reverseall()">
<input type='button' value="取消" onclick="cancleall()">
<table border="1">
<thead>
<tr>
<th>选项</th>
<th>ip</th>
<th>端口</th>
</tr>
</thead>
<tbody id="tb">
<tr>
<td><input type="checkbox"></td>
<td>1.1.1.1</td>
<td>80</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>1.1.1.2</td>
<td>81</td>
</tr><tr>
<td><input type="checkbox"></td>
<td>1.1.1.3</td>
<td>83</td>
</tr>
</tbody>
</table>
<script src="jquery-1.12.4.js"></script>
<script>
function checkall() {
$('#tb :checkbox').prop('checked',true);
}
function cancleall() {
$('#tb :checkbox').prop('checked',false)
}
function reverseall() {
$('#tb :checkbox').each(function () {
//this代指当前循环的每一个元素,这个this其实是dom对象
//1-dom的写法
// if(this.checked){
// this.checked = false;
// }else {
// this.checked = true;
// }
//2-jQuery的写法
// if($(this).prop('checked')){
// $(this).prop('checked',false);
// }else {
// $(this).prop('checked',true);
// }
//3-三元运算
var v = $(this).prop('checked')? false:true;
$(this).prop('checked',v)
})
}
</script>
</body>
</html>