2014-10-29 75 views
1

我是JavaScript/CSS新手。顯示:none/block for elements works in Firefox,not in Safari or Chrome

我在用於控制右側單元格內容的單行表的左側單元格中有一個冗長的表格。爲了減少垂直滾動,我將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() 

調試警報(按預期工作。

我的錯誤是什麼,我該如何解決?無論是純JavaScript還是jQuery都可以接受。

回答

4

正確的語法是:

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

jQuery中:

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