javascript - element.style 未定义

Question

问题是获取错误:

TypeError: div1.style is undefined

这会导致函数未被调用并且什么也没有发生的问题。

JS

<script type="text/javascript">
  function siteChange() {
    var div1 = board1;
    var div2 = board2;

    if (div1.style.visibility == "collapse") {
      div2.style.visibility = "collapse";
      div1.style.visibility = "visible";
    } else {
      div1.style.visibility = "collapse";
      div2.style.visibility = "visible";

    }
  }
</script>

CSS

.FullDiv {
    height: 100%;
    width: 100%;    
}

ASP

<div id="board1" class="FullDiv">
    <dx:ASPxDashboardViewer ID="ASPxDashboardViewer1" runat="server" ClientInstanceName="board1" DashboardSource="~/PP_Dashboard_all.xml" Height="100%" Width="100%"></dx:ASPxDashboardViewer>
</div>
<div id="board2" class="FullDiv" style="visibility: collapse">
    <dx:ASPxDashboardViewer ID="ASPxDashboardViewer2" runat="server" ClientInstanceName="board2" DashboardSource="~/PP_Dashboard2.xml" Height="100%" Width="100%"></dx:ASPxDashboardViewer>
</div>

ASP函数调用

<a href="Javascript:siteChange()" class="PageNumber">1</a>
<a href="Javascript:siteChange()" class="PageNumber">2</a>

Answer 1

它无法映射您的 board1 和 board2 这就是它给出错误的原因:

 function siteChange() {
        var div1 = document.getElementById("board1");//change this
        var div2 = document.getElementById("board2");//change this
        if (div1.style.visibility == "collapse") {
        
          div2.style.visibility = "collapse";
          div1.style.visibility = "visible";
        } else {
          div1.style.visibility = "collapse";
          div2.style.visibility = "visible";
    
        }
      }

现在它为你工作。