<!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. wireshark抓取本地回环及其问题

    一:The NPF driver isn't running 这个错误是因为没有开启NPF服务造成的. NPF即网络数据包过滤器(Netgroup Packet Filter,NPF)是Winpcap ...

  2. json和gson的区别

    json是一种数据格式,便于数据传输.存储.交换gson是一种组件库,可以把java对象数据转换成json数据格式 GSON简单处理JSON json格式经常需要用到,google提供了一个处理jso ...

  3. 共享锁&排它锁 || 乐观锁&悲观索

    1.共享锁只用于表级,排他锁用于行级. 2.加了共享锁的对象,可以继续加共享锁,不能再加排他锁.加了排他锁后,不能再加任何锁. 3.比如一个DML操作,就要对受影响的行加排他锁,这样就不允许再加别的锁 ...

  4. 【UOJ Round #8】

    A 一道不错的题,虽然大家都觉得是水题,然而蒟蒻我想出来的好慢……Orz alpq 发现其实就是一个网格图,每一个大块都是同一颜色……横纵坐标互不干扰…… //UOJ Round #8 A #incl ...

  5. find-k-pairs-with-smallest-sums

    // https://discuss.leetcode.com/topic/50527/java-10ms-solution-no-priority-queue class Solution { pu ...

  6. DeDeCMS(织梦)变量覆盖0day getshell

    测试方法: @Sebug.net   dis本站提供程序(方法)可能带有攻击性,仅供安全研究与教学之用,风险自负! #!usr/bin/php -w <?php error_reporting( ...

  7. HDU2669 Romantic 扩展欧几里德 对我来说有陷阱

    这道题对我来说有陷阱虽说是赤果果的扩展欧几里德,看样子基本攻还是不够哈,基本功夫一定要好,准备每天上那种洗脑课时分  多看看数论书,弥补一下 自己 狗一样的基础, 这道题用到了一个性质: 对于不定整数 ...

  8. How To Open An URL In Android’s Web Browser

    How To Open An URL In Android’s Web Browser 以下核心代码片断,将展现使用“android.content.Intent” 打开一个指定的 URL. butt ...

  9. std::vector利用swap()函数进行内存的释放【转】

    首先,vector与deque不同,其内存占用空间只会增长,不会减小.比如你首先分配了10,000个字节,然后erase掉后面9,999个,则虽然有效元素只有一个,但是内存占用仍为10,000个.所有 ...

  10. 如何将DB2的数据库转换到mySQL中？

    经过几次尝试最终找到解决的办法,因为网上并没有详细说明,所以下面我将详细的步骤记录如下: 1． 大前提是你已经安装好DB2服务器和mySQL服务器,现在只是借用Navicat for MySQL这个软 ...