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');

编辑：我认为你误解了方法逻辑如果要更改容器<tr>元素的样式，则必须遍历checkbox集合中的每个元素，并在其上运行一些代码：

$("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]或仅替换为：复选框。试试这个。

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

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

3 个答案: