Question

我正在尝试在复选框的 onchange 事件中更改表格的背景颜色 。我的复选框在我的表格内。我写了一个简单的javascript代码，但如果任何人可以帮我解决这个问题，我无法改变我的表的颜色。这是我的代码..

    function getcolor()
    {

       var color=document.getElementById("item");
        var color2=document.getElementById("item").bgColor = 'red';
        alert(color.bgColor);
        alert("its"+color2.bgColor);
    }

而我的桌子有id ='item'。这是我的复选框代码

<input type="checkbox" id='id' onchange="getcolor();"/>

感谢.......

Answer 1

您想要的属性是style.backgroundColor而不是bgColor。

function getcolor() { 
    var color=document.getElementById("item"); 
    var color2=document.getElementById("item").style.backgroundColor = 'red'; 
    alert(color.style.backgroundColor); 
    alert("its"+color2); 
}

如果要更改不同的表ID，可以使用以下命令：

function getcolor(tableID) { 
    var color=document.getElementById(tableID); 
    var color2=document.getElementById(tableID).style.backgroundColor = 'red';
    alert(color.style.backgroundColor); 
    alert("its"+color2); 
}

然后您可以根据表ID以不同方式调用它，例如：

getcolor("item");

Answer 2

尝试

 document.getElementById('yourId').style.backgroundColor = "Red";

修改：这在我的最后工作：

<html>
    <head>
    <script type="text/javascript">
    function getcolor()
        {

            var color=document.getElementById("item");
            var color2=document.getElementById("item").style.backgroundColor = 'red';
            alert(color.style.backgroundColor);
            alert("its"+color2.style.backgroundColor);
        }
    </script>
</head>
<body>
    <pre>
        <table border="0" align="center" id="item" style=" color:#FFF;background-color:#000066">
            <th>Some Title</th>
        </table>
    </pre> 
    <input type="checkbox" id='id' onchange="getcolor();"/>
  </body>
 </html>

Answer 3

我相信这是您的代码更加格式化：

function getcolor() {
    var color=document.getElementById("item");
    var color2=document.getElementById("item").bgColor = 'red';
    alert(color.bgColor);
    alert("its"+color2.bgColor);
}

如上面的答案中所述，您需要的是

var color2 = document.getElementById('item').style.backgroundColor = 'red';

在第二个警告中， color2 已经是一种颜色，因此color2.bgColor（或者正确的，color2.style.backgroundColor）是错误的。

使用javascript更改表格的背景颜色时出现问题

3 个答案: