<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

 <html>

   <head>

     <meta http-equiv="content-type" content="text/html; charset=UTF-8">

     <script type="text/javascript" src="../js/jquery-1.8.2.js"></script>

   </head>

   <body>

     <table border="1" align="center">

         <tr>

             <th>状态</th>

             <th>用户名</th>

         </tr>

         <tr>

             <td><input type="checkbox"/></td>

             <td>赵</td>

         </tr>

         <tr>

             <td><input type="checkbox"/></td>

             <td>钱</td>

         </tr>

         <tr>

             <td><input type="checkbox"/></td>

             <td>孙</td>

         </tr>

         <tr>

             <td><input type="checkbox"/></td>

             <td>李</td>

         </tr>

         <tr>

             <td><input type="checkbox"/></td>

             <td>周</td>

         </tr>

         <tr>

             <td><input type="button" value="全选中"/></td>

             <td><input type="button" value="全取消"/></td>

             <td><input type="button" value="全反选"/></td>

         </tr>

     </table>

     <script type="text/javascript">

         //页面加载时，将全取消按钮失效

         window.onload = function(){

             $(":button:eq(1)").attr("disabled","disabled");

         }

         //全选中

         $(":button:eq(0)").click(function(){

             //所有复选框设置为选中状态

             $(":checkbox").attr("checked","checked");

             //将该按钮失效

             $(this).attr("disabled","disabled");

             //将全取消按钮生效

             $(":button:eq(1)").removeAttr("disabled");

         });

         //全取消

         $(":button:eq(1)").click(function(){

             //所有选中的复选框删除选中属性

             $(":checkbox:checked").removeAttr("checked");

             //将该按钮失效

             $(this).attr("disabled","disabled");

             //将全选中按钮生效

             $(":button:eq(0)").removeAttr("disabled");

         });

         //全反选

         $(":button:eq(2)").click(function(){

             //将选中的失效

             $(":checkbox:checked").attr("disabled","disabled");

             //将未选中的选中

             $(":checkbox:not(:checked)").attr("checked","checked");

             //将失效的生效，同时删除选中属性

             $(":checkbox:disabled").removeAttr("disabled").removeAttr("checked");            

         });

     </script>

   </body>

 </html>

全反选或者

     $(":button:eq(2)").click(function(){

         $(":checkbox").each(function(){

             if($(this).attr("checked")!=null)

             {

                 $(this).removeAttr("checked");

             }

             else

             {

                 $(this).attr("checked","checked");

             }

         });

     });

jquery checkbox选框操作的更多相关文章

  1. jQuery——复选框操作

    学习jQuer对表单.表格操作的过程中,按照书上的例子发现一个问题: <!DOCTYPE html> <html> <head> <title>复选框应 ...

  2. jquery 复选框操作-prop()的使用

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

  3. jquery复选框操作

    $('input[type="checkbox"]').change(function(e) { var checked = $(this).prop("checked& ...

  4. Jquery全选系列操作（锋利的jQuery）

    Jquery全选系列操作(锋利的jQuery) <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" ...

  5. C#：复选框操作类

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.W ...

  6. Jquery复选框

    Jquery复选框 1.checkbox list选择 代码: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//E ...

  7. JS及Dom练习 | 模态对话框及复选框操作

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

  8. Selenium之勾选框操作

    勾选框操作:       所谓勾选框,意思是可以勾选一个及以上或全部勾选.勾选框的图标一般都是方形的. 复选框勾选一般分为三种情况: ①勾选单个框,我们直接用元素定位的方式定位到点击即可. ②勾选多个 ...

  9. Thymeleaf+layui+jquery复选框回显

    一.Thymeleaf+layui+jquery复选框回显 基于Thymeleaf模板下的layui+jquery复选框回显,主要是jquery.大致意思是:把数组转成JSON传到前台,再在前台转回数 ...

随机推荐

  1. putty的保存功能如何使用

    Putty的设置保存功能隐藏的实在太好了,原来在Connection菜单中修改设置后,并不能在该界面保存. 保存步骤: 1.需要点击Session菜单,选中下面的Default Setting. 2. ...

  2. 《Windows核心编程》第九章——用内核对象进行线程同步

    先举一个有bug的例子: #include <iostream> #include <windows.h> #include <process.h> using n ...

  3. css3 transform方法常用属性

    css3中transform方法是一个功能强大的属性,可以对元素进行移动.缩放.转动.拉长或拉伸等功能. transform中最为常用的4个属性分别是:rotate();.scale();.skew( ...

  4. Maximum Likelihood Method最大似然法

    最大似然法,英文名称是Maximum Likelihood Method,在统计中应用很广.这个方法的思想最早由高斯提出来,后来由菲舍加以推广并命名. 最大似然法是要解决这样一个问题:给定一组数据和一 ...

  5. 在Ubuntu 12.04 桌面上设置启动器（快捷方式）

    在Ubuntu 12.04 桌面上设置启动器(快捷方式)过程讲解: 如下图所示,Eclipse 和 SQLDeveloper 都可以直接双击打开,这些应用程序的启动器都在 /usr/share/app ...

  6. C++中List的用法

    Lists将元素按顺序储存在链表中. 与 向量(vectors)相比, 它允许快速的插入和删除,但是随机访问却比较慢. assign() 给list赋值 back() 返回最后一个元素 begin() ...

  7. Windows 下Npm和NodeJS升级

    前提电脑中已经安装过NodeJS, npm.现在需要进行升级操作. 1.查看当前的npm和NodeJs的版本: C:\Users\Administrator>node -vv4.4.3 C:\U ...

  8. 跨平台app开发（引擎）工具的选择【转】

    跨平台app开发(引擎)工具的选择 1.html5执行速度慢,用户体验不好 2.原生应用开发,即ios和安卓分别开发,需要两种技术人员,后期代码维护困难,很难达到统一. 3.xamarin是一款c#的 ...

  9. C++初始化列表和大括号中构造的差别

    C++的对象构造函数有两种初始化的方法: 1.初始化列表 2.大括号中面赋值 这两种推荐使用另外一种.原因在于使用初始化列表仅仅须要进行一次初始化.而使用大括号内赋值的话首先须要调用默认构造函数初始化 ...

  10. 转：好用 Eclipse插件收集与说明

    http://developer.51cto.com/art/201007/214478.htm