单击时将在HTML表中显示隐藏列的按钮

Question

快速提问。 我有一个按钮定义为：

<input type='button' id='button' value='Development View' >

包含以下信息的div标签：

echo "<div id = 'content' style='display:none'>";
    echo "<th>Development Status</th>";
echo "</div>";

每当单击按钮时就会运行一些JavaScript：

var button = document.getElementById('button'); // Assumes element with id='button'

button.onclick = function() {
     var div = document.getElementById('content');
     if (div.style.display !== 'none') {
         div.style.display = 'none';
     }
    else {
        div.style.display = 'block';
    }
};

我的最终目标是切换动态HTML表中列的可见性，但是我什至无法切换这个简单的标题标签。 我没有收到错误消息，但是该按钮似乎没有任何作用。 我回显了HTML，因为这是一个PHP脚本。

Answer 1

将您的JavaScript包装在window.onload事件中

window.onload = function () {

  var button = document.getElementById('button'); // Assumes element with id='button'

  button.onclick = function() {
    var div = document.getElementById('content');
    if (div.style.display !== 'none') {
      div.style.display = 'none';
    }
    else {
      div.style.display = 'block';
    }
  }
};