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

最新推荐文章于 2022-09-02 14:03:06 发布

原创最新推荐文章于 2022-09-02 14:03:06 发布 · 5.9k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#jquery #function #input #button

JS 专栏收录该内容

5 篇文章

订阅专栏

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

下面介绍两种使用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>