使用jQuery获得选中复选框个数

最新推荐文章于 2020-10-21 10:58:25 发布

天才小鱼

最新推荐文章于 2020-10-21 10:58:25 发布

阅读量5.9k

点赞数 2

CC 4.0 BY-SA版权

分类专栏： JS 文章标签： jquery function input button

本文链接：https://blog.youkuaiyun.com/geniusxiaoyu/article/details/7252395

JS 专栏收录该内容

5 篇文章

订阅专栏

本文介绍两种利用jQuery高效获取网页上被选中复选框数量的方法。第一种方法通过遍历所有名为'ChooseOne'的复选框元素并检查其是否被选中来计数；第二种方法则直接利用jQuery选择器获取已选中复选框的数量。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

下面介绍两种使用jQuery来获取页面中选中复选框个数的方法：

<html>
<head>
      <title>test</title>
      <script src="jquery-1.3.2.min.js" type="text/javascript"></script>

<script type="text/javascript">
//方法一
$(function(){
$("#GetButton_1").click(
function(){
     var CheckCount=0;
     $("[name='ChooseOne']").each(function(){
        if($(this).attr("checked")){
            CheckCount++;
        }
     });
     alert(CheckCount);
});
});
//方法二
$(function(){
$("#GetButton_2").click(
function(){
     alert($("input[name='ChooseOne']:checked").length);
});
});
</script>
</head>
<body>
<input type="checkbox" name="ChooseOne" >
<input type="checkbox" name="ChooseOne" >
<input type="checkbox" name="ChooseOne" >
<input type="checkbox" name="ChooseOne" >
<input type="checkbox" name="ChooseOne" >

<br>
<input name="GetButton_1" id="GetButton_1" type="button" value="方法一">
<input name="GetButton_2" id="GetButton_2" type="button" value="方法二">
</body>

</html>