切换Flot图

Question

我在一个HTML文件中分发了9个工作Flot图表，但其中7个并不像第1和第2个文件那么相关，所以我希望“切换”它们，以便能够隐藏/显示它们，只有当它们是需要的时候，作为“额外”信息。我一直在寻找信息，但我刚刚找到了关于如何切换一个情节系列的信息，我想要的是显示/隐藏整个情节区域，以保持网页“干净”。

我试过以下几种方法：

<script>
    // Flot Charts code...
</script>
<div id="placeholder">
</div>
<script>
  $( "#button" ).click(function() {
     $( "#placeholder" ).toggle();
  });
</script>
<button id="button">Show/Hide</button>

但它只是显示按钮和情节，但当我点击按钮，情节不会消失.有什么想法吗？谢谢!

Answer 1

在HTML中有按钮之前，先将click事件绑定到按钮。

在完全加载DOM之后，交换这些或使用$(function() { ... });在您的jQuery中运行绑定。

Answer 2

我以前也遇到过这样的事情。我所做的不过是按一下div键。

<div id="userchart">
      <center>
          <canvas id="barchart" height="450" width="600"></canvas>
      </center>
</div>

jQuery

$("#toggle-user").click(function()
    {
        $('#userchart').slideToggle(500);
    });