时间戳

首页 > 解决方案 > 计算已检查属性的最短方法

jquery - 计算已检查属性的最短方法

问题描述

我在 AEM 中有一个复选框列表当我们点击复选框时，选中的属性将被放置在父元素上，而不是在输入框中。我要计算检查了多少

console.log(
  $('.isCorrectanswer').attr('checked').length
);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<coral-checkbox class="isCorrectanswer" checked>
  <input type="checkbox" name="./checkboxone" />
  <label>checkbox</label>
</coral-checkbox>
<coral-checkbox class="isCorrectanswer" checked>
  <input type="checkbox" name="./checkboxtwo" />
  <label>checkbox</label>
</coral-checkbox>
<coral-checkbox class="isCorrectanswer">
  <input type="checkbox" name="./checkboxthree" />
  <label>checkbox</label>
</coral-checkbox>
<coral-checkbox class="isCorrectanswer">
  <input type="checkbox" name="./checkboxfour" />
  <label>checkbox</label>
</coral-checkbox>
<coral-checkbox class="isCorrectanswer">
  <input type="checkbox" name="./checkboxfive" />
  <label>checkbox</label>
</coral-checkbox>

这对我不起作用...

标签： jquerycheckboxaem

解决方案

使用.isCorrectanswer[checked]选择器：

console.log(
  $('.isCorrectanswer[checked]').length
);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<coral-checkbox class="isCorrectanswer" checked>
    <input type="checkbox" name="./checkboxone" />
    <label>checkbox</label>
  </coral-checkbox>
  <coral-checkbox class="isCorrectanswer" checked>
    <input type="checkbox" name="./checkboxtwo" />
    <label>checkbox</label>
  </coral-checkbox>
  <coral-checkbox class="isCorrectanswer">
    <input type="checkbox" name="./checkboxthree" />
    <label>checkbox</label>
  </coral-checkbox>
  <coral-checkbox class="isCorrectanswer">
    <input type="checkbox" name="./checkboxfour" />
    <label>checkbox</label>
  </coral-checkbox>
  <coral-checkbox class="isCorrectanswer">
    <input type="checkbox" name="./checkboxfive" />
    <label>checkbox</label>
  </coral-checkbox>

（旁注：为了命名一致性，您可能会考虑将类重命名为isCorrectAnswer, 或is-correct-answer，这看起来很容易产生错字错误）

推荐阅读