<!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. coursera课程Text Retrieval and Search Engines之Week 3 Overview

    Week 3 OverviewHelp Center Week 3 On this page: Instructional Activities Time Goals and Objectives K ...

  2. 【TYVJ 五月图论专项有奖比赛】

    最短路+TSP+最小生成树+倍增LCA+TreeDP 第一题 其实是个TSP问题(然而我没发现),但是关键点很少,只有5个,所以用dij+heap分别预处理出来这五个点为源的最短路…… 然后枚举起点 ...

  3. connection to sys should be as sysdba or sysoper 解决的方法

    连接时提示: 出现了例如以下的情况:EXP-00056;遇到ORACLE错误28009. ORA-28009:connection   to   sys   should   be   as   sy ...

  4. Servlet监听器统计在线人数

    监听器的作用是监听Web容器的有效事件,它由Servlet容器管理,利用Listener接口监听某个执行程序,并根据该程序的需求做出适应的响应. 例1 应用Servlet监听器统计在线人数. (1)创 ...

  5. JDBC结合JSP使用（1）

    1. 添加数据 在jsp页面中添加数据,和在serv中添加数据相似.获得页面中提交的数据以后,把数据保存到数据库表中,JSP的代码如下: add.jsp <%@ page language=&q ...

  6. chromium中的性能优化工具syzyProf

    函数性能分析工具SyzyProf 我先开始介绍SyzyProf.这个工具可以捕获每个线程调用每个函数执行的时间,然后把结果生成一个KCacheGrind能够识别的数据格式文件,然后通过KCacheGr ...

  7. uva 10160 Servicing Stations（DFS+剪枝）

    Servicing stations A company offers personal computers for sale in N towns (3 <= N <= 35). The ...

  8. VMware vCenter中, 如何辩认虚机上Raw Device Mapping过了的一块物理磁盘?

    比如说, 我们有一套VMware的环境, 其中有一台运行者ESXi的主机, 其上有十块SAS盘. 这十块盘中的五块盘被RDM到一台虚机上了. 假设你发现有添加多了一块盘, 你想移除掉, 但是5块盘其中 ...

  9. mybatis的mapper返回map结果集(springboot)

    通过MapKey指定map的key值 @MapKey("id") Map<Long, UserInfo> getUserInfoMap(); @MapKey(" ...

  10. 【python】理想论坛帖子爬虫1.06

    昨天认识到在本期同时起一百个回调/线程后程序会崩溃,造成结果不可信. 于是决定用Python单线程操作,因为它理论上就用主线程跑不会有问题,只是时间长点. 写好程序后,测试了一中午,210个主贴,11 ...