Question

我是JavaScript / CSS新手。

我在一行表的左侧单元格中有一个冗长的目录，用于控制右侧单元格的内容。为了减少垂直滚动，我将ToC分成两部分，并用display：block / display：none切换它们的可见性。

这适用于Firefox 33，但不适用于Safari 6.2，Chrome 31.0或Eclipse内置浏览器[OSX 10.8.5]。

这里是切换的代码（首先是HTML，然后是JavaScript）：

<h4>Contents: <a href='javascript:void(0)' onclick="changeToC(1);">Pages 1-12</a>
<a href='javascript:void(0)' onclick="changeToC(2);">Pages 13-24</a></h4>

function changeToC(number) {
    if (number==1) {
        document.getElementById('EiT_ToC2').style="display: none";
        document.getElementById('EiT_ToC1').style="display: block";
    } else {
        alert("trying to show ToC 2"); // DEBUG
        document.getElementById('EiT_ToC1').style="display: none";
        document.getElementById('EiT_ToC2').style="display: block";
    } // end if
} // end changeToC()

调试alert（）按预期工作。

我的错误是什么？如何解决？无论是纯JavaScript还是jQuery都可以接受。

Answer 1

正确的语法是：

document.getElementById('EiT_ToC1').style.display = "none";

在jquery中：

$("#EiT_ToC1").css("display", "none");

显示：元素的none / block适用于Firefox，而不适用于Safari或Chrome

1 个答案: