如何使用jquery迭代选择器的结果

Question

我有一些复选框，当选择多个复选框时，我想更改它们的背景颜色。我正在尝试这样：

var checked = $("input[@type=checkbox]:checked");
$('tr[name="' + checked.attr('name') + '"]').each(function() {
                        $(this).css('background-color', '#0000DD');
                    });

只有第一个选择的更改是颜色，其他选择的不是，你能帮助我吗？选择器只给出第一个输出吗？

这样解决：

$("input[type=checkbox]:checked").parents('tr').css('background-color', '#0000DD');

Answer 1

jQuery 不是 XPath。省略@。此外，.css 方法将样式应用于集合中的所有元素，因此您可以省略 .each。

var checked = $("input[type=checkbox]:checked");
$('tr[name="' + checked.attr('name') + '"]').css('background-color', '#0000DD');

编辑：我认为您误解了方法逻辑。
如果要更改容器 元素的样式，则必须循环遍历复选框集合中的每个元素，并对其运行一些代码：

$("input[type=checkbox]:checked").each(function() {
    $(this).closest('tr').css('background-color', '#0000DD');
});

Answer 2

.attr 只会返回第一个匹配元素的属性。您必须遍历第一个选择器的结果（并且还要选择不带@的属性）：

var checked = $("input[type=checkbox]:checked").each(function() {
    $('tr[name="' + $(this).attr('name') + '"]').css('background-color', '#0000DD');
});

Answer 3

将 [@type=checkbox] 替换为 [type=checkbox] 或仅替换 ':checkbox`。试试这个。

$("input:checkbox:checked").each(function(){
     $('tr[name="' + this.name + '"]').each(function() {
          $(this).css('background-color', '#0000DD');
     });
});