$(this).prop('checked') 不适用于检查 Jquery 的复选框 [关闭]答案

【问题标题】：$(this).prop('checked') not working for checking checkbox for Jquery [closed]$(this).prop('checked') 不适用于检查 Jquery 的复选框 [关闭]
【发布时间】：2020-02-08 06:14:06
【问题描述】：

我有带有 HTML 的复选框：

<input type="checkbox" class="selectMakeup" name="needsPartNumber">

可以有很多具有相同类的复选框。我想遍历每个选中的复选框。

$('.selectMakeup').each(function() {
  console.log($(this).html())
  console.log($(this).prop('checked'))
  if ($(this).prop('checked')) {
    //Do Stuff
  }

})

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" class="selectMakeup" name="needsPartNumber">

console.log($(this).html())

<input type="checkbox" name="needsPartNumber">

但是console.log($(this).prop('checked')) 返回undefined。

【问题讨论】：

第一个打印出""，因为该元素没有innerHTML。第二个返回false，正如预期的那样。 jsfiddle.net/khrismuc/r64bdhqo - 遍历所有复选框：$('input[type=checkbox]:checked').each(...)
如果第一个日志打印出您所说的打印内容，则表示您正在选择其父级。
没错，这也解释了为什么 prop 是未定义的。
此结果不能来自您显示的 HTML 和 JS。贴出真实代码。
在 Edge Chromium 中运行代码，我看到空白，然后是 false...

标签： javascript jquery html

【解决方案1】：

这应该返回给定类的所有选中复选框

$('.selectMakeup:checked').each(function() {});

【讨论】：

【解决方案2】：

如果你想检查一个复选框/单选选项是否被“选中”，你可以使用.is()：

$('.selectMakeup').each(function(){
    console.log($(this).is(":checked"));
    if($(this).is(':checked')){
      // Do something
    }
});

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="checkbox" class="selectMakeup" name="needsPartNumber">

-- 编辑--

正如 cmets 所建议的，$(this).prop("checked") 应该返回 true 或 false，除非您通过 $(this) 定位一个不是单选框/复选框的元素。

【讨论】：

这会起作用，但原始测试也应该如此。
.is() 是选择器检查，而.prop() 检查其属性。两者都有效，但后者是首选方法且速度最快。
啊，是的；只是做了一些更多的测试。在 SO (console.log($("input[type=radio]").prop("checked"));) 上运行测试时，我在undefined 结果上得到了误报。最初得到undefined，因为目前没有渲染radio选项，直到我打开close对话框并按预期得到true和false。
您应该考虑使用Stack Snippet 在您的答案中同时包含 JavaScript 和 HTML——这样更容易测试。
按照您的方式，您必须遍历每个复选框。如果您查看我的答案，它只会返回选中的复选框