关于实现点击表格一行中任意一行即选中该行相关复选框，同时改变背景色的问题

我是这样实现的，在tr的onclick事件中，添加查找该行所属复选框，并更改相关的checked属性为!checked，这个过程没有问题。

但是问题出在：我单击同属于该行的复选框时，该复选框的属性没法改变，怎么办？

我写的相关代码如下：

///通过单击行反选该行所有CheckBox
function SelectTR(tr)
{
    var tds=tr.childNodes;
    for(var j=0; j<tds.length;j++)
    {
        var inputs=tds[j].childNodes;
        for (var i=0; i < inputs.length; i++) // 遍历页面上所有的 input
        {
            if (inputs[i].type == "checkbox")
            {
                inputs[i].checked = !inputs[i].checked;
                tr.style.backgroundColor = inputs[i].checked ? "#fafdc6" : "";
            }         
        } 
    }  
}

调用时在tr上加上: onclick="SelectTR(this);" 这样调用的。

9 个解决方案

#1

代码中那个注释错了。 是遍历该行所有input。代码实现用了两个循环，外循环遍历td，内循环遍历td中的内容。

#2

什么意思？你是说你点击单行的时候，复选框都选中了，而点击复选框时，却没起作用？？？

#3

对。点击单行的时候，该行的复选框选中了，但点复选框时，不能改变。

我估计是点复选框的时候，同时也执行了tr的onclick事件。

#4

你在 checkbox 控件上 有 onclick 事件吗？

#5

引用 4 楼 milo4210 的回复:

你在 checkbox 控件上 有 onclick 事件吗？

没有

#6

刚测试了一下， 可以肯定问题是出在这里：

inputs[i].checked = !inputs[i].checked;

#7

将你的HTML 页面代码 发给我 [e-mail]

#8

用一个笨办法解决了。呵呵。希望能出现有更好的解决办法。

我在checkbox的onclick事件中添加了一句：this.checked=!this.checked;

贴子保留一天吧。经验分享下，明天如果还是没有更好的办法就用这办法好了。

谢谢米罗！

#9

up and study!