Question

我希望能够点击表格单元格，让它切换到color1，然后在下一次单击时将其切换到color2，然后再切换回color1 ......依此类推。

function cSwap(cell){ 
 if (cell.style.backgroundColor = "#00000F")
 {
  cell.style.backgroundColor = "#F00000";
 }
 else if (cell.style.backgroundColor = "#F00000")
 {
  cell.style.backgroundColor = "#00000F";
 }
}

现在，它只会更改为第一种颜色，后续点击不会执行任何操作。

表中的单元格如下所示：

<td classname='t' onclick='cSwap(this);' width='100' height='100' id='nw'><a href="" id="nw"></a></td>

...一旦我完成所有工作（除此之外），这将是CSS。

Answer 1

你需要双等于比较：

  if (cell.style.backgroundColor == "#00000F")

如果您愿意，

或triple等于。

Answer 2

即使有双重等号，它也行不通。在检索到其值时，backgroundColor会将其字符串更改为Firefox中的rgb值（并且其他浏览器的行为可能相同）。

解决方案是将这些颜色放在一个类中，并在单击时切换表格单元格的类。这也更通用，因为你可以轻松改变颜色。

CSS：

.t  { background: #00f }
.t2 { background: #f00 }

此外，属性称为class，而不是classname。请记住，您不能拥有两个具有相同ID的元素：

<td class='t' onclick='cSwap(this)' width='100' height='100'><a href=""></a></td>
<td class='t' onclick='cSwap(this)' width='100' height='100'><a href=""></a></td>

随附的脚本：

function cSwap(cell){  
    if (cell.className == "t")
        cell.className = "t2";
    else if (cell.className == "t2")
        cell.className = "t";
}

单击时交换表格单元格颜色

2 个答案: