jquery处置复选框

项目中操作checkbox是经常碰到的，有了jquery后操作起来简单明了,代码如下：

Js代码? ?

1. $(?function()?{??
2. ??
3. ????//全选??
4. ????$("#selectAll").click(?function()?{??
5. ????????$("input[name='send-mail']").each(?function()?{??
6. ????????????$(this).attr("checked",?true);??
7. ????????});??
8. ????});??
9. ????//?反选??
10. ????$("#inverseAll").click(?function()?{??
11. ????????$('input[name="send-mail"]').each(?function()?{??
12. ????????????$(this).attr("checked",?!$(this).attr("checked"));??
13. ????????});??
14. ????});??
15. ??
16. ????//?取消全部??
17. ????$("#deselectAll").click(?function()?{??
18. ????????$("input[name='send-mail']").each(?function()?{??
19. ????????????$(this).attr("checked",?false);??
20. ????????});??
21. ????});??
22. ??
23. ????//?选中的值??
24. ????$("#sendMailAll").click(?function()?{??
25. ????????var?selectedStr?=?"";??
26. ????????var?$sendMail?=?$("input[name='send-mail']");??
27. ????????$sendMail.each(?function()?{??
28. ????????????if?($(this).attr("checked"))?{??
29. ????????????????selectedStr?+=?$(this).val()?+?",";??
30. ????????????}??
31. ????????});??
32. ????????if?($.trim(selectedStr)?==?"")?{??
33. ????????????alert("请未选中任何数据!");??
34. ????????????return?false;??
35. ????????}??
36. ???????????????alert(selectedStr?);??
37. ??????????
38. ????});??
39. ??
40. });??

?其页面部分代码如下:

Html代码? ?

1. <div>??
2. ???<s:iterator?value="page.result">??
3. ????<tr>??
4. ????????????<td><input?type="checkbox"?name="send-mail"?id="send-mail-id-${sendMailId}"?value="${sendMailId}"/></td>??
5. ????</tr>???
6. ????</s:iterator>??
7. </div>??
8. <div?id="footer-checkbox"??style="width:?100%;?margin-left:?260px;">??
9. <input?type="button"?id="selectAll"?name="selectAll"?value="全选"?/>??
10. <input?type="button"?id="inverseAll"?name="inverseAll"?value="反选"?/>??
11. <input?type="button"?id="deselectAll"?name="deselectAll"?value="取消"?/>??
12. <input?type="button"?id="sendMailAll"?name="sendMailAll"?value="发送"?/>??
13. </div>??

?在使用前，记得将jquery引进

Js代码? ?

1. <script?src="js/jquery.js"?type="text/javascript"></script>??

?

     $("document").ready(function(){
       $("#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()+"\r\n";
            //alert($(this).val());
          })
         alert(str);
       })
      })

?