javascript - 如何检查每个循环中的复选框

Question

考虑一个简单的 each 循环来检查选中的复选框:

$(':checkbox').filter(':checked').each(function(){
    var name = $(this).val();
});

此代码适用于在原始 HTML 代码中选中的复选框，如

<input type="checkbox" name="test" value="test" checked="checked" />

如何使此 jQuery 代码实时运行，以便在每次选中新框或删除选中框时执行 filter 过程。我想在复选框(选中或未选中)发生任何更改时运行每个循环，以返回当前选中的更新值。

注意:这是表达问题的简化代码。目的不是记录name，而是处理each循环中检查的值。

Answer 1

使用点击:

$(':checkbox').click(function() {
    $(':checkbox').filter(':checked').each(function() {
        var name = this.value;
    });
});

注意事项:

• 您可以避免多次查询 DOM。
• :checkbox 是一个非常慢的选择器，因为它不是一个 css 选择器而是一个 jQuery 扩展。
• 不要使用 jQuery 获取这个值。

你可以这样改进你的代码:

var $checkboxes = $('input[type="checkbox"]');
$checkboxes.filter(':checked').each(function() {
    var name = this.value;
});

阅读资源:

• > The cost of $(this)
• > Why we prefix our variables with $ in jQuery