1 
<script>
    function toggle_table() {
        visibility = document.getElementById("table").style.visibility;
        document.getElementById("table").style.visibility = (visibility == 'visible') ? 'hidden' : 'visible';
        document.getElementById("toggle_table").innerHTML = (visibility == 'visible') ? 'Open' : 'Close';
    }
</script>

<form method='POST'>
    <a id='toggle_table' href='#' onClick='toggle_table()'>Open</a> WIJZIGEN PROCES
    <table id='table' style='visibility: hidden'>
    </table>
</form>

这很好用。虽然我不想让它不可见，但我不想渲染 innerHTML（所以它在不可见时不会占用它的空间）。与此问题类似，尽管我无法使用 JQuery（要求）。这是用纯 JavaScript 以一种相当简单的方式，而不需要将整个 HTML 内容放在 Javascript 中吗？

4

3 回答 3

1

使用display：

document.getElementById("table").style.display = (display == 'none') ? '' : 'none';
于 2013-03-15T10:36:52.290 回答
0

使用display:tableanddisplay:none代替visibility:hidden/visible

于 2013-03-15T10:36:55.343 回答
0

您可以尝试使用display属性

function toggle_table() {
    display = document.getElementById("table").style.display;
    document.getElementById("table").style.display= (display != 'none') ? 'none' : 'table';
    document.getElementById("toggle_table").innerHTML = (display== 'table') ? 'Open' : 'Close';
}
于 2013-03-15T10:37:40.043 回答