jquery如何判断checkbox（复选框）是否被选中

最新推荐文章于 2021-09-10 18:41:42 发布

吃完苹果好睡觉

最新推荐文章于 2021-09-10 18:41:42 发布

阅读量410

点赞数

分类专栏： javascript 文章标签： jquery checkbox

javascript 专栏收录该内容

6 篇文章 0 订阅

订阅专栏

经常碰到问题是关于checkbox的，这类问题主要就是前端获取到一组复选框中被选中的复选框的值，所以使用jquery能很快的得到结果，下面是关于复选框的各种情况的解决办法。

代码如下：

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<script type="text/javascript" src="http://www.cnjquery.com/demo/jquery.js"></script>
<script type="text/javascript">
 $("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).is(':checked'))
    {
      $(this).removeAttr("checked");
    }
    else
    {
      $(this).attr("checked",'true');  
    }
    })
  })

  $("#btn5").click(function(){
    var str="";
    $("[name='checkbox']").each(function(){
      if($(this).is(':checked')){
        str+=$(this).val()+""r"n";
        //alert($(this).val());
      }
    })
   alert(str);
  })

 })

</script>

</head>
<body>
  <form name="form1" method="post" action="">
    <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>
</body>
</html>

吃完苹果好睡觉

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery如何判断checkbox（复选框）是否被选中

经常碰到问题是关于checkbox的，这类问题主要就是前端获取到一组复选框中被选中的复选框的值，所以使用jquery能很快的得到结果，下面是关于复选框的各种情况的解决办法。代码如下：<html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><script type="text/java
复制链接

扫一扫