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

发布时间:2020-04-17 23:45:31 作者:q564362102
来源:网络 阅读:2942

 谁都知道 html 如果一个复选框被选中 checked="checked"


但是我们如果用jquery alert($("#id").attr("checked")) 会提示您是true而不是checked

所以很多朋友判断  if($("#id").attr("checked")=="true") 这个是错误的,其实应该是 if($("#id").attr("checked")==true)

例子里面包括了一下几个功能。

  1. <input type="button" id="btn1" value="全选"> 
  2.    <input type="button" id="btn2" value="取消全选"> 
  3.    <input type="button" id="btn3" value="选中所有奇数"> 
  4.    <input type="button" id="btn4" value="反选"> 
  5.    <input type="button" id="btn5" value="获得选中的所有值"> 
  6.  
  7. 代码 
  8.   
  9. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
  10. <HTML> 
  11.  <HEAD> 
  12.   <TITLE> New Document </TITLE> 
  13.   <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
  14.     <SCRIPT LANGUAGE="JavaScript" src="http://www.cnjquery.com/demo/jquery.js"></script> 
  15.   <SCRIPT LANGUAGE="JavaScript"> 
  16.   <!-- 
  17.    $("document").ready(function(){ 
  18.      
  19.     $("#btn1").click(function(){ 
  20.       
  21.     $("[name='checkbox']").attr("checked",'true');//全选 
  22.    
  23.     }) 
  24.        $("#btn2").click(function(){ 
  25.       
  26.     $("[name='checkbox']").removeAttr("checked");//取消全选 
  27.    
  28.     }) 
  29.     $("#btn3").click(function(){ 
  30.       
  31.     $("[name='checkbox']:even").attr("checked",'true');//选中所有奇数 
  32.    
  33.     }) 
  34.     $("#btn4").click(function(){ 
  35.       
  36.     $("[name='checkbox']").each(function(){ 
  37.       
  38.     
  39.      if($(this).attr("checked")) 
  40.    { 
  41.     $(this).removeAttr("checked"); 
  42.      
  43.    } 
  44.    else 
  45.    { 
  46.     $(this).attr("checked",'true'); 
  47.      
  48.    } 
  49.     
  50.     }) 
  51.    
  52.     }) 
  53.      $("#btn5").click(function(){ 
  54.     var str=""
  55.     $("[name='checkbox'][checked]").each(function(){ 
  56.      str+=$(this).val()+""r"n"; 
  57.    //alert($(this).val()); 
  58.     }) 
  59.    alert(str); 
  60.     }) 
  61.    }) 
  62.   //--> 
  63.   </SCRIPT> 
  64.    
  65.  </HEAD> 
  66.  <BODY> 
  67.  <form name="form1" method="post" action=""> 
  68.    <input type="button" id="btn1" value="全选"> 
  69.    <input type="button" id="btn2" value="取消全选"> 
  70.    <input type="button" id="btn3" value="选中所有奇数"> 
  71.    <input type="button" id="btn4" value="反选"> 
  72.    <input type="button" id="btn5" value="获得选中的所有值"> 
  73.    <br> 
  74.    <input type="checkbox" name="checkbox" value="checkbox1"> 
  75.    checkbox1 
  76.    <input type="checkbox" name="checkbox" value="checkbox2"> 
  77.    checkbox2 
  78.    <input type="checkbox" name="checkbox" value="checkbox3"> 
  79.    checkbox3 
  80.    <input type="checkbox" name="checkbox" value="checkbox4"> 
  81.    checkbox4 
  82.    <input type="checkbox" name="checkbox" value="checkbox5"> 
  83.    checkbox5 
  84.    <input type="checkbox" name="checkbox" value="checkbox6"> 
  85.    checkbox6 
  86.    <input type="checkbox" name="checkbox" value="checkbox7"> 
  87.    checkbox7 
  88.    <input type="checkbox" name="checkbox" value="checkbox8"> 
  89.  checkbox8 
  90.  </form> 
推荐阅读:
  1. Jquery判断checkbox是否被选中
  2. 判断checkbox是否选中

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

1 ue he

上一篇:thinkphp实现登录后返回原界面

下一篇:工作节点配置

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》