Javascript 如何在切换复选框时获得选中的复选框数

我希望在切换复选框时选中复选框的数量。下面提到的代码给出了未定义的输出

Javascript

$('[data-qtype="select-all"] input').on('click', function(){
    console.log($(this).prop( "checked" ).length);
});

HTML

<div class="survey-question" data-page-no="2" data-qtype="select-all" data-qnum="7" data-required="true" style="display: block;">
  <label>Question text...</label>
  <div class="radio-item">
    <input type="checkbox" name="q7" value="T" data-shell-qnum="16">option 1</div>
  <div class="radio-item">
    <input type="checkbox" name="q7" value="T" data-shell-qnum="17">option 2</div>
  <div class="radio-item">
    <input type="checkbox" name="q7" value="T" data-shell-qnum="18">option 3</div>
  <div class="radio-item">
    <input type="checkbox" name="q7" value="T" data-shell-qnum="19">option 4</div>
  <div class="radio-item">
    <input type="checkbox" name="q7" value="T" data-shell-qnum="20">option 5</div>
  <div class="radio-item">
    <input type="checkbox" name="q7" value="T" data-shell-qnum="21">option 6</div>
</div>

问题文本。。。
选择1
选择2
选择3
选择4
备选案文5
备选案文6

您可以使用

$（'input:checkbox:checked'）.length

（或者简单地使用

$（'.radio item:checked'）

）来获取选中复选框的数量，我强烈建议您对复选框和单选按钮之类的元素使用

更改

，而不是

单击

：

$（'[data qtype=“select all”]input'）。在（'change'，function（）上{
console.log（$（'.radio项输入：复选框：checked'）.length）；
});

问题文本。。。
选择1
选择2
选择3
选择4
备选案文5
备选案文6
编辑

误解了OP的要求。编辑答案以正确解决问题。在代码段中注释了详细信息。

我不能100%确定您希望所有复选框都被选中，所以我添加了一个“主”复选框

片段


//在[all]复选框上代表单击事件
$（'[name=“all”]'）。在（'click'，function（）上{
//然后使每个[q7]复选框的属性“选中”为真
$（'[name=“q7”]'）.prop（'checked'，true）；
});
/*将变更事件委托给form#survey
||这将涵盖任何和所有变更事件
||在表单中触发
*/
$（“#调查”）。关于（'change'，function（）{
//申报柜台
变量数量=0；
//每个（）复选框。。。
$（'[name=“q7”]'）。每个（函数（obj）{
//如果选中此选项
如果（$（this）.is（':checked'））{
//增量计数器
数量++；
} 
//显示新的输出计数#数量
$（'数量'）.val（数量）；
});
});

选中所有选项

问题文本。。。
选择1
选择2
选择3
选择4
备选案文5
备选案文6
为了更好地理解您的问题，最好也提供
HTML
代码。@lonut我添加了htmlOk。我已经为您添加了一个答案。有没有一种方法可以用来引用
$（this）
而不是
$（'.radio item input:checkbox:checked'）
，因为我有多个调查问题？@RahulDagli，您可以使用
$（this）.Is（':checked'）
来查看复选框是否被选中。如果我使用
console.log（$（this）.Is（':checked'）.length）;它给了我未定义的error@RahulDagli，您不能在此上使用类似于
.length
之类的属性。那么，它的解决方案是什么？实际上，我想参考$（此）而不是您提到的特定选择器，如您提到的
$（'[name=“q7”]'）