<!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. 转: LDAP有啥子用? 用户认证

    认证的烦恼 小明的公司有很多IT系统, 比如邮箱.SVN.Jenkins , JIRA,VPN, WIFI...... 等等 . 新人入职时需要在每个系统中申请一遍账号,每个系统对用户名和密码的要求还 ...

  2. MyEclipse中的内置浏览器中的历史记录怎么清除

    eclipse内置浏览器的访问记录是存储在对应的工程目录下的.metadata配置中,也就是说你新建一个工程的话就没有了. 如果确实要删除那就找到工作空间中的org.eclipse.ui.browse ...

  3. scala的一些特殊用法

    1.创建多行字符串,只要把多行字符串放在3个双引号间("""...""")即可.这是Scala对于here document,或者叫here ...

  4. Spark源码分析

    名词解释 RDD全称为ResilientDistributedDataset,弹性分布式数据集.就是分布在集群节点上的数据集,这些集合可以用来进行各种操作.最重要的一点是,某个操作计算后的数据集可以缓 ...

  5. IOS UITableView多选删除功能

    UITbableView作为列表展示信息,除了展示的功能,有时还会用到删除,比如购物车.收藏列表等. 单行删除功能可以直接使用系统自带的删除功能,当横向轻扫cell时,右侧出现红色的删除按钮,点击删除 ...

  6. 模拟QQ心情图片上传预览

    出于安全性能的考虑,目前js端不支持获取本地图片进行预览,正好在做一款类似于QQ心情的发布框,找了不少jquery插件,没几个能满足需求,因此自己使用SWFuplad来实现这个图片上传预览. 先粘上以 ...

  7. DataTrigger

    <ListView Name="lvStatus" MinHeight="120" Grid.Row="2"> <List ...

  8. CentOS 服务器安全设置

      我们必须明白:最小的权限+最少的服务=最大的安全.所以无论是配置任何服务器,我们都必须把不用的服务关闭.把系统权限设置到最小化,这样才能保证服务器最大的安全. 一.注释掉系统不需要的用户和用户组 ...

  9. C++数据结构面试题

    原文:http://1527zhaobin.iteye.com/blog/1537110 一.判断链表是否存在环型链表问题:   说明:判断一个链表是否存在环,例如下面这个链表就存在环,n1--> ...

  10. Android 之 AndroidManifest.xml 详解（一）

    当Android启动一个应用程序组件之前,它必须知道哪些个组件是存在的,所以开发人员在开发过程中,必须将应用程序中出现的组件一一在AndroidManifest.xml文件中" 声明 &qu ...