jQuery如何判断checkbox(复选框)是否被选中

发布于 2022-09-14 09:08:51 字数 5527 浏览 13 评论 0

jQuery如何判断checkbox(复选框)是否被选中

谁都知道 在html 如果一个复选框被选中 是 checked="checked"。
但是我们如果用jquery alert($("#id").attr("checked")) 会提示您是true而不是checked
所以很多朋友判断 if($("#id").attr("checked") == "true") 这个是错误的,其实应该是 if($("#id").attr("checked") == true)
下面是使用实例:

  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <title> New Document </title>
  5. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  6. <script type="text/javascript" src="http://www.cnjquery.com/demo/jquery.js"></script>
  7. <script type="text/javascript">
  8. <!--$("document").ready(function(){   
  9. $("#btn1").click(function(){        
  10. $("[name='checkbox']").attr("checked",'true');//全选   
  11. })   
  12. $("#btn2").click(function(){        
  13. $("[name='checkbox']").removeAttr("checked");//取消全选   
  14. })   
  15. $("#btn3").click(function(){        
  16. $("[name='checkbox']:even").attr("checked",'true');//选中所有奇数   
  17. })   
  18. $("#btn4").click(function(){  //反选        
  19. $("[name='checkbox']").each(function(){            
  20. if($(this).attr("checked"))            
  21. {               
  22. $(this).removeAttr("checked");            
  23. }            
  24. else           
  25. {               
  26. $(this).attr("checked",'true');            
  27. }        
  28. })   
  29. })   
  30. $("#btn5").click(function(){  //获得选中的所有值        
  31. var str="";        
  32. $("[name='checkbox'][checked]").each(function(){            
  33. str+=$(this).val()+""r"n";            
  34. //alert($(this).val());        
  35. })        
  36. alert(str);   
  37. })})//-->
  38. </script>
  39. </head>
  40. <body>
  41. <form name="form1" method="post" action="">
  42. <input type="button" id="btn1" value="全选" />
  43. <input type="button" id="btn2" value="取消全选" />
  44. <input type="button" id="btn3" value="选中所有奇数" />
  45. <input type="button" id="btn4" value="反选" />
  46. <input type="button" id="btn5" value="获得选中的所有值" /><br />
  47. <input type="checkbox" name="checkbox" value="checkbox1" /> checkbox1
  48. <input type="checkbox" name="checkbox" value="checkbox2" /> checkbox2
  49. <input type="checkbox" name="checkbox" value="checkbox3" /> checkbox3
  50. <input type="checkbox" name="checkbox" value="checkbox4" /> checkbox4
  51. <input type="checkbox" name="checkbox" value="checkbox5" /> checkbox5
  52. <input type="checkbox" name="checkbox" value="checkbox6" /> checkbox6
  53. <input type="checkbox" name="checkbox" value="checkbox7" /> checkbox7
  54. <input type="checkbox" name="checkbox" value="checkbox8" /> checkbox8
  55. </form></body></html>
  56. //************单个checkbox全选************//
  57. function clickCheckbox(){   
  58. if($("#checkPathAll").attr("checked"))   
  59. {        
  60. $("input[name='checkPath']").each(function() {            
  61. $(this).attr("checked", true);        
  62. });   
  63. }   
  64. else   
  65. {      
  66. $("input[name='checkPath']").each(function() {            
  67. $(this).attr("checked", false);        
  68. });   
  69. }}

复制代码

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文