CHECKBOX全选,取消全选,反选 jquery代码

方法一 

$("#myform").togglecheckboxes()//全选,取消全选,反选
$("#myform").togglecheckboxes(":not(#checkbox1)")//全选,取消全选且不选中第一个,反选
$("#myform").togglecheckboxes(".top5", true)//全选,取消全选且只选前五个,反选
$("#myform").checkcheckboxes();// 全选
$("#myform").checkcheckboxes(":not(#checkbox1)");//除第一个之外全选
$("#myform").checkcheckboxes(".top5", true);//前五个全选
$("#myform").uncheckcheckboxes(); //取消全选
$("#myform").uncheckcheckboxes(":not(#checkbox1)");//取消全选,排除第一个
$("#myform").uncheckcheckboxes(".top5", true);//取消全选排除前五个

方法二

<script language=网页特效 src="jquery.js"></script>
<script language="javascript">
<!--
    $("document").ready(function(){
    
     $("#all").click(function(){  
    if(this.checked){  
        $("input[name='checkbox']").each(function(){this.checked=true;});
 $("#btn1").attr("value","反选");  
    }else{  
        $("input[name='checkbox']").each(function(){this.checked=false;});  
        $("#btn1").attr("value","全选");
    }  
 }); 

     $("#btn1").click(function(){
        
       $("[name='checkbox']").attr("checked",'true');//全选
     
     })
     $("#btn2").click(function(){
         
         $("[name='checkbox']").removeattr("checked");//取消全选
     
    })
       $("#btn3").click(function(){
         
        $("[name='checkbox']:even").attr("checked",'true');//选中所有奇数
     
      })
       $("#btn4").click(function(){
         
         $("[name='checkbox']").each(function(){
            
           
             if($(this).attr("checked"))
            {
              $(this).removeattr("checked");
             
            }
           else
           {
             $(this).attr("checked",'true');
              
          }
         
         })
      
       })
        $("#btn5").click(function(){
      var str="";
          $("[name='checkbox'][checked]").each(function(){
             str+=$(this).val()+" ";
         })
       alert(str);
    })
      })
 //-->
 </script>
<body>
<form name="form1" method="post" action="">
  <input type="checkbox" id="all" name="all">
  <input type="button" id="btn1" value="全选">
  <input type="button" id="btn2" value="取消全选">
   <input type="button" id="btn3" value="选中所有奇数">
  <input type="button" id="btn4" value="反选">
  <input type="button" id="btn5" value="获得选中的所有值">
   <br>
  <input type="checkbox" name="checkbox" value="checkbox1">
  checkbox1
   <input type="checkbox" name="checkbox" value="checkbox2">
 checkbox2
   <input type="checkbox" name="checkbox" value="checkbox3">
  checkbox3
   <input type="checkbox" name="checkbox" value="checkbox4">
   checkbox4
  <input type="checkbox" name="checkbox" value="checkbox5">
   checkbox5
   <input type="checkbox" name="checkbox" value="checkbox6">
   checkbox6
  <input type="checkbox" name="checkbox" value="checkbox7">
  checkbox7
   <input type="checkbox" name="checkbox" value="checkbox8">
 checkbox8
 </form>

方法二

<input type="button" class="btn_selectallbg" id="checkall2" value="全选" />

<input type="checkbox"  name="groupid[]"  value="遍历的某列值 " />

 

// 给全选按钮添加全选功能
    $('#checkall2').toggle(function(){
            $("input[name='groupid[]']").each(function(){
                $(this).attr('checked',true);
            });
            $(this).attr('value','取消');
        },function(){
            $("input[name='groupid[]']").each(function(){
                $(this).attr('checked',false);
            });
            $(this).attr('value','全选');
        }
);

方法三

<script type="text/javascript">
 <!--
$(document).ready(function(){

$("#abutton").click(function(){ $("input[@type=checkbox]").check(); });
$("#ubutton").click(function(){ $("input[@type=checkbox]").uncheck(); });

});

jquery.fn.extend({
check: function() { return this.each(function() { this.checked = true; }); },
uncheck: function() { return this.each(function() { this.checked = false; });
 }
});
//-->
</script>

<button id="abutton">全选</button>
<button id="ubutton">反选</button>

<input type="checkbox" value="" />a
<input type="checkbox" value="" />b
<input type="checkbox" value="" />c
<input type="checkbox" value="" />d
<input type="checkbox" value="" />e

时间: 2024-09-17 04:52:58

CHECKBOX全选,取消全选,反选 jquery代码的相关文章

JQUERY CHECKBOX全选,取消全选,反选方法三_jquery

jquery.checkboxes.zip,然后解压引用到使用插件的页面,这个不用多说了吧!下面看具体例子,为了让大家更好的理解,我直接把实现功能的代码贴出来: 复制代码 代码如下: $("#myform").toggleCheckboxes()//全选,取消全选,反选 $("#myform").toggleCheckboxes(":not(#checkbox1)")//全选,取消全选且不选中第一个,反选 $("#myform"

jQuery实现复选框全选/取消全选/反选及获得选择的值

  这篇文章主要介绍了jQuery实现的复选框全选/取消全选/反选及获得选择的值,需要的朋友可以参考下 <!DOCTYPE html> <html> <head> <script type="text/javascript" src="../js/jquery-1.9.1.js"></script> <script type="text/javascript"> $(docu

jquery 实现checkbox全选/取消全选

jQuery.attr  获取/设置对象的属性值,如:  代码如下 复制代码 $("input[name='chk_list']").attr("checked");     //读取所有name为'chk_list'对象的状态(是否选中) $("input[name='chk_list']").attr("checked",true);      //设置所有name为'chk_list'对象的checked为true 再如

checkbox全选/取消全选以及checkbox遍历jQuery实现代码_jquery

复制代码 代码如下: <html> <head> <script src="jquery-1.3.2.min.js" type="text/javascript"></script> </head> <body> <input type="checkbox" name="chk_list" id="chk_list_1" valu

完整的jquery全选/取消全选示例效果

由于这两个比较简单,我就直接上代码吧: //全选/取消全选$('#quanxuan').toggle(function () {     $("input[name='abc']").attr("checked", 'true'); }, function () {     $("input[name='abc']").removeAttr("checked"); }); //反选$('#fanxuan').click(fun

html中的javascript 全选/取消全选操作示例代码

全选/取消全选在批量操作数据时经常会使用到,下文有个不错的示例使用js完成全选/取消全选操作,感兴趣的朋友可以参考下     复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>无标题文档</title> <script type="tex

jQuery实现复选框全选/取消全选/反选及获得选择的值_jquery

复制代码 代码如下: <!DOCTYPE html> <html> <head> <script type="text/javascript" src="../js/jquery-1.9.1.js"></script> <script type="text/javascript"> $(document).ready(function() { // 全选/取消全部 $(&qu

DataGrid 的 全选/取消全选 控制(CheckBox)

datagrid|控制 DataGrid控件: <Columns>        <asp:TemplateColumn>         <HeaderStyle Width="10px"></HeaderStyle>         <HeaderTemplate>          <INPUT id="CheckAll" name="CheckAll" type="

jQuery判断checkbox(复选框)是否被选中以及全选、反选实现代码

 本篇文章主要是对jQuery判断checkbox(复选框)是否被选中以及全选.反选实现代码进行了介绍,需要的朋友可以过来参考下,希望对大家有所帮助 jQuery判断checkbox(复选框)是否被选中: if($("#id").attr("checked")==true)   jQuery实现checkbox(复选框)选中.全选/反选代码:    代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0