Javascript 如何更改表中行的颜色

我正在用html开发一个表。每行都有一个复选框，其属性名称与标记tr相同。因此，如果raw是唯一选中的，我想将选中的行涂成黄色，否则将所有选中的行涂成蓝色。所以我开发了这个：

var checked = $("input[@type=checkbox]:checked");  
                var nbChecked = checked.size(); 
                if(nbChecked==1){
                   var row = $('tr[name*="'+checked.attr("name")+'"]');
                   row.style.backgroundColor="#FFFF33";
                }

但颜色不变：（你能告诉我为什么吗？你能帮我吗

<TR valign=top name="<?php echo $not[$j]['name'];?>">
        <TD width=12 style="background-color:#33CCCC">
        <div class="wpmd">
            <div align=center>
                <font color="#FF0000" class="ws7">
                    <input type="checkbox" name="<?php echo $not[$j]['name'];?>" onchange="analizeCheckBox()"/>
            </div>
.
.
.
.
.
.

---

虽然这段代码不能让您完全了解函数性，但它确实执行行更新


下面是Javascript：

function updateRows() {
    var checked = $("input:checked");
    var nbChecked = checked.size();
    if (nbChecked == 1) {
        checked.parent().parent().css("background", "#FFFF33");
    }
}

$(function () { $("input:checkbox").click(updateRows)});​

首先，你得到的是单元格的背景色，而不是行的背景色。你需要移动它

以下是您的固定html：

<table>
  <tr style="vertical-align:top; background-color:#33CCCC">
    <td style="width:12px">
      <div class="wpmd">
        <div class="ws7" style="text-align:center; color:#FF0000">
          <input type="checkbox" />
        </div>
      </div>
    </td>
  </tr>
</table>

更改“td.ws7”选择器以符合您的需要

使用选择器字符串调用jQuery函数
$（）
时，即使只有1或0个元素匹配，它也会返回类似数组的jQuery对象。因此，您的代码：

row = $('tr[name*="'+checked.attr("name")+'"]');
row.style.backgroundColor="#FFFF33";

var checked = $("input[@type=checkbox]:checked");

不起作用，因为
row
不是具有
style
属性的DOM元素，它是一个jQuery对象，类似于具有许多额外方法的数组。可以使用数组样式表示法访问匹配的各个DOM元素，因此：

row[0].style.backgroundColor = "#FFFF33";

将用于更新第一个匹配的DOM元素。如果没有匹配的元素，则
行[0]
将被取消定义，并且您将得到一个错误。
行.length
将告诉您匹配了多少个元素

在代码中：

row = $('tr[name*="'+checked.attr("name")+'"]');
row.style.backgroundColor="#FFFF33";

var checked = $("input[@type=checkbox]:checked");

您不需要使用
@
符号来匹配属性名称，因此
输入[type=checkbox]：选中“
是可以的，但是
输入：复选框：选中“
更简单

因此，最后进入您的实际需求，即当一行有一个复选框将该行的背景设置为黄色时，但如果多行有复选框将所有这些行的背景设置为蓝色，则只需三行代码即可：

// reset all trs to default color
$("tr").css("background-color", "yourdefaultcolorhere");
// select the checked checkboxes
var checked = $("tr input:checkbox:checked");
// set the checked checkboxes' parent tr elements' background-color
// according to how many there are
checked.closest("tr").css("background-color",
                          checked.length===1 ? "yellow" : "blue");

请注意，您根本不需要通过
name
属性进行选择，因为jQuery将让您找到选中复选框所属的tr元素

工作演示：
您的表格单元格的背景色将覆盖它…该行将是您想要的颜色，但它被单元格的颜色所覆盖。为什么不
$（'tr[name*=“'+checked.attr（'name'）+'”）.css（'background-color'，'ffffff33'））
；我不确定“checked”是否是有效的varname@animuson你说得对！这就是问题所在；）谢谢！！！scuse me，但var checked=$（“input[@type=checkbox]：checked”）；什么回报？如果选中的元素大于1，则为数组？