欢迎各位兄弟 发布技术文章

这里的技术是共享的

You are here

jQuery操作CheckBox的方法(选中,取消,取值)详解 有大用

shiping1 的头像

全选和取消全选(全不选)最好要下面的方法 我自己亲自做的

$('.wx_user_id_check_all').click(function(){
    if($(this).is(':checked')){

        $("[name='wx_user_id_check']").each(function(){
           //$(this).attr("checked",'checked');//全选
            $(this)[0].checked=true;
        });
    }
    else{
        $("[name='wx_user_id_check']").each(function(){
            //alert(111);
            //$(this).removeAttr("checked");//全选
            $(this)[0].checked=false;
        });
    }

});
全选和取消全选(全不选) 也可以用下面的方法 dedecms做的
function selAll()
{
    for(i=0;i<document.form2.arcID.length;i++)
    {
        if(!document.form2.arcID[i].checked)
        {
            document.form2.arcID[i].checked=true;
        }
    }
}
function noSelAll()
{
    for(i=0;i<document.form2.arcID.length;i++)
    {
        if(document.form2.arcID[i].checked)
        {
            document.form2.arcID[i].checked=false;
        }
    }
}



 
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">     

  2. <HTML>     

  3.  <HEAD>     

  4.   <TITLE> New document.nbsp;</TITLE>     

  5.   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />     

  6.     <SCRIPT LANGUAGE="javascript" src="http://www.cnjquery.com/demo/jquery.js"></script>     

  7.   <SCRIPT LANGUAGE="javascript">     

  8.   <!--     

  9.    $("document.quot;).ready(function(){     

  10.          

  11.     $("#btn1").click(function(){     

  12.           

  13.     $("[name='checkbox']").attr("checked",'true');//全选     

  14.        

  15.     })     

  16.        $("#btn2").click(function(){     

  17.           

  18.     $("[name='checkbox']").removeAttr("checked");//取消全选     

  19.        

  20.     })     

  21.     $("#btn3").click(function(){     

  22.           

  23.     $("[name='checkbox']:even").attr("checked",'true');//选中所有奇数     

  24.        

  25.     })     

  26.     $("#btn4").click(function(){     

  27.           

  28.     $("[name='checkbox']").each(function(){     

  29.           

  30.         

  31.      if($(this).attr("checked"))     

  32.    {     

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

  34.          

  35.    }     

  36.    else    

  37.    {     

  38.     $(this).attr("checked",'true');     

  39.          

  40.    }     

  41.         

  42.     })     

  43.        

  44.     })     

  45.      $("#btn5").click(function(){     

  46.     var str="";     

  47.     $("[name='checkbox'][checked]").each(function(){     

  48.      str+=$(this).val()+""r"n";     

  49.    //alert($(this).val());     

  50.     })     

  51.    alert(str);     

  52.     })     

  53.    })     

  54.   //-->     

  55.   </SCRIPT>     

  56.        

  57.  </HEAD>     

  58.     

  59.  <BODY>     

  60.  <form name="form1" method="post" action="">     

  61.    <input type="button" id="btn1" value="全选">     

  62.    <input type="button" id="btn2" value="取消全选">     

  63.    <input type="button" id="btn3" value="选中所有奇数">     

  64.    <input type="button" id="btn4" value="反选">     

  65.    <input type="button" id="btn5" value="获得选中的所有值">     

  66.    <br>     

  67.    <input type="checkbox" name="checkbox" value="checkbox1">     

  68.    checkbox1     

  69.    <input type="checkbox" name="checkbox" value="checkbox2">     

  70.    checkbox2     

  71.    <input type="checkbox" name="checkbox" value="checkbox3">     

  72.    checkbox3     

  73.    <input type="checkbox" name="checkbox" value="checkbox4">     

  74.    checkbox4     

  75.    <input type="checkbox" name="checkbox" value="checkbox5">     

  76.    checkbox5     

  77.    <input type="checkbox" name="checkbox" value="checkbox6">     

  78.    checkbox6     

  79.    <input type="checkbox" name="checkbox" value="checkbox7">     

  80.    checkbox7     

  81.    <input type="checkbox" name="checkbox" value="checkbox8">     

  82.  checkbox8     

  83.  </form>     

普通分类: