<!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="notCheck()"/>
<input type="button" value="取消" onclick="notCheckAll()"/>
<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>20012</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>1.1.1.1</td>
<td>20012</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>1.1.1.1</td>
<td>20012</td>
</tr>
<tr>
<td><input type="checkbox"></td>
<td>1.1.1.1</td>
<td>20012</td>
</tr>
</tbody>
</table>
<script src="jquery.js"></script>
<script>
function checkAll() {
$('#tb :checkbox').prop('checked',true);
}
function notCheckAll(){
$('#tb :checkbox').prop('checked',false);
}
function notCheck() {
$('#tb :checkbox').each(function (k) {
// this,指代的是当前循环的每个元素
// 使用dom方法
// if(this.checked){
// this.checked=false
// }else{this.checked=true;}
// 使用jquery的第一种方式:
// if($(this).prop('checked')){
// $(this).prop('checked',false)
// }else{$(this).prop('checked'),true;}
// 使用三元运算进一步精简版的jquery实现方式
var v= $(this).prop('checked')?false:true;
$(this).prop('checked',v);
})
}
</script>
</body>
</html>

  

jquery实现全选,反选,取消的操作的更多相关文章

  1. python: jquery实现全选 反选 取消

    引入这个jquery-1.12.4.js jquery实现全选 反选 取消 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitio ...

  2. jquery实现全选 反选 取消

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. jquery实现全选,取消,反选的功能&实现左侧菜单

    1.全选,取消,反选的例子 <!DOCTYPE html> <html lang="en"> <head> <meta charset=& ...

  4. jquery 书写全选反选功能

    书写一个后台管理中用到的全选反选功能.代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta ...

  5. jQuery --checkbox全选和取消全选简洁高效的解决办法

    最近在公司做了一个小项目,其中有一个全选和取消全选的这么一个模块,搞了半天找不到一种最佳的解决方案!后来通过各种努力找到了一种简洁高效的解决办法,这里想和大家分享一下.有问题的话,还望各路大神指导一二 ...

  6. jquery实现全选/反选功能

    <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...

  7. jquery购物车全选,取消全选,计算总金额

    这是html代码 <div class="gwcxqbj"> <div class="gwcxd center"> <div cl ...

  8. jQuery实现全选/反选和批量删除

    <%@ page language="java" contentType="text/html; charset=utf-8"     pageEncod ...

  9. jquery实现全选、取消反选、加JavaScript三元运算(三种法法实现反选)

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  10. jquery 实现全选反选

    jquery代码 $(function () { $('#inputCheck').click(function () { if ($(this).attr("checked")) ...

随机推荐

  1. Firewalld--02 端口访问/转发、服务访问、源地址管理

    目录 防火墙端口访问/转发.服务访问.源地址管理 1. 防火墙端口访问策略 2. 防火墙服务访问策略 3.防火墙接口管理 4.防火墙源地址管理 5. 防火墙端口转发策略 防火墙端口访问/转发.服务访问 ...

  2. 将两个列表合并为字典_其中一个列表为Key_一个列表为Value

    #定义两个列表 list1 = range(0,10) list2 = range(10,20) #合并为字典,调用dict(zip()) dict_name = dict(zip(list1,lis ...

  3. 树——binary-tree-maximum-path-sum(二叉树最大路径和)

    问题: Given a binary tree, find the maximum path sum. The path may start and end at any node in the tr ...

  4. [POJ 1390] Blocking

    问题描述 Some of you may have played a game called 'Blocks'. There are n blocks in a row, each box has a ...

  5. matplotlib.pyplot 包

    import matplotlib.pyplot as plt 图片的打开和保存: from PIL import Image img=Image.open('....') img.save('... ...

  6. 转载-使用Nodepad++来编辑我们服务器的配置文件

    转自------------------ 作者:李阿昀 来源:CSDN 原文:https://blog.csdn.net/yerenyuan_pku/article/details/73128819 ...

  7. crfclust.bdb导致磁盘满

    检查ora.crf服务 crsctl stat res ora.crf -init -t 关闭ora.crf服务 crsctl stop res ora.crf -init cd $ORACLE_HO ...

  8. PADS软件

    最近学习PADS,搜集到的一些软件.之前一直在使用Altium designer,但是AD太占资源了,还有都说PADS比AD好. 下面是来自网上对主流PCB的介绍(原文:http://9mcu.com ...

  9. 杂项-SAP:SAP (服务访问点(Service Accessing point))

    ylbtech-杂项-SAP:SAP (服务访问点(Service Accessing point)) 1.返回顶部 1. SAP,是Service Accessing point的缩写,意思是服务访 ...

  10. leetcode 217. 存在重复元素 (python)

    给定一个整数数组,判断是否存在重复元素. 如果任何值在数组中出现至少两次,函数返回 true.如果数组中每个元素都不相同,则返回 false. 示例 1: 输入: [1,2,3,1]输出: true示 ...