Javascript 选择全部选中复选框将返回全部复选框，而不是使用JQuery

这是我的密码

JS文件

$( document ).ready(function() {

    $(".test").children().filter(function(index, elem){
      console.log($(elem).children(":checked"));
    });

})

HTML

 <ul class="test">
 <li><input type="checkbox" name="1"><label>something</label></li>
 <li><input type="checkbox" name="2"><label>something</label></li>
 <li><input type="checkbox" name="3"><label>something</label></li>
 <li><input type="checkbox" name="4" checked><label>something</label></li>
 </ul>

某物
某物
某物
某物

我试图选中所有选中的复选框，但如果我按

：checked

进行筛选，我将改为选中所有复选框

---

我做错了什么？

要选择选中的输入，只需使用：

var checked=$（“输入：选中”）

见

如果必须仅限于该
ul
内的输入，您还可以指定类别：

var checked=$（“.test输入：checked”）

见此。
要选择选中的输入，只需使用：

var checked=$（“输入：选中”）

见

如果必须仅限于该
ul
内的输入，您还可以指定类别：

var checked=$（“.test输入：checked”）

请看这个。
更准确地说

var allChecked = $('.test input[type="checkbox"]:checked');

让您在具有类
test
的元素的子元素下选中所有复选框，并测试是否选中复选框，您可以使用

var bool = $(selector).is(":checked"); 
// return true if checked false if not
//where selector can be any jQuery selector

更准确地说

var allChecked = $('.test input[type="checkbox"]:checked');

让您在具有类
test
的元素的子元素下选中所有复选框，并测试是否选中复选框，您可以使用

var bool = $(selector).is(":checked"); 
// return true if checked false if not
//where selector can be any jQuery selector

其他答案建议了更好的方法来选择您想要的复选框，我同意这些方法更直截了当，比您的过滤方法更可取，但在这里，我试图解释您在代码中实际看到的内容

转到你的小提琴并在Chrome调试器中运行它，看起来它做了正确的事情，而且由于
console.log（）的行为，你可能根本看不到你所期望的

我将您的console.log行拆分为两个单独的步骤-获取与
匹配的子项（ren）：选中
选择器，然后记录该变量；所以它看起来像：

$( document ).ready(function() {

    $(".test").children().filter(function(index, elem) {
        //console.log($(elem).children(":checked"));
        boxen = $(elem).children(":checked");
        debugger;
        console.log(boxen);
    });
})


这将循环调用filter（）函数四次-每个最初选择的
$（“.test”）.children（）元素一次。在第一次调用时，索引将是
0
（零），elem将是第一个
元素。

调用
boxen=$（elem）.children（“：checked”）将为您提供
[]
。。。也就是说，一个空数组，因为没有检查第一个li的子元素。

然而，当您
console.log（boxen）
时，它会给您一些“奇怪”的输出，因为这是jQuery。。。它不是一个简单的javascript数组

当您进入第四次迭代时，查看第四个选定元素，索引将是
3
，elem将是第四个


当你在那一个上
$（elem）.children（“：checked”）
时，你会得到类似
[​]（您如何看待它将在一定程度上取决于您的javascript调试器）-因此，这次它选择了一个选中的输入元素

如果在变量中选择
.children（“：checked”）
，您确实得到了所需的复选框，但是
控制台.log（）
输出欺骗了您。
其他答案建议了更好的方法来选择您想要的复选框，我同意这些方法更直截了当，比您的过滤方法更可取，但这里我试图解释您在代码中实际看到的内容

转到你的小提琴并在Chrome调试器中运行它，看起来它做了正确的事情，而且由于
console.log（）的行为，你可能根本看不到你所期望的

我将您的console.log行拆分为两个单独的步骤-获取与
：checked
选择器匹配的子项（ren），然后记录该变量；这样看起来：

$( document ).ready(function() {

    $(".test").children().filter(function(index, elem) {
        //console.log($(elem).children(":checked"));
        boxen = $(elem).children(":checked");
        debugger;
        console.log(boxen);
    });
})


这将循环调用filter（）函数四次-对于最初选择的
$（“.test”）.children（）
元素各一次。在第一次调用时，索引将为
0
（零），elem将是第一个
元素。

调用
boxen=$（elem）.children（“：checked”）；
将为您提供
[]
…也就是说，一个空数组，因为第一个li的子元素都没有被检查。

但是，当您
console.log（boxen）
时，它会给您一些“奇怪”的输出，因为这是jQuery…它不是一个普通的javascript数组

当您进入第四次迭代时，查看第四个选定元素，索引将是
3
，elem将是第四个


当你在那一个上
$（elem）.children（“：checked”）
时，你会得到类似
[​]（您如何看待它将在一定程度上取决于您的javascript调试器）-因此，这次它选择了一个选中的输入元素

如果您在变量中选择
.children（“：checked”）
，您确实得到了所需的一个复选框，但是
控制台.log（）
输出欺骗了您。
我还有其他复选框不在
class=“test”
$（“.test input:checked”）下
将返回null我不确定您看到的结果是什么。请查看我发布的额外链接-它会按预期返回选中的输入。我有其他复选框不在
class=“test”
$（“.test input:checked”）下
将返回空值。我不确定您看到的是什么结果。请查看我发布的额外链接-它按预期返回选中的输入。