切換血塊圖

Question

我在HTML文件中分布了9個工作的Flot Chart圖，但是其中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

我以前遇到過這樣的事情。 我所做的只是切換div。

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

jQuery的

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

Answer 2

在將按鈕包含在HTML中之前，應將click事件綁定到按鈕。

交換這些或使用$(function() { ... }); 在jQuery中運行，以便在DOM完全加載后運行綁定。