javascript - 隐藏 onload 并显示点击事件无法正常工作

Question

我正在尝试在我的网站上使用 display:none 和 display:block。样式如下:

<style>
  .div_class {
    display: none;
  }
</style>

正文内容是:

<div class="div_class">
   <div id="graph_id"></div>
</div>

脚本是:

    <script>
      // some event occurs and sets the display property of div_class to block as follows
      $(".div_class").css('display','block'); 

      var BarGraph = echarts.init(document.getElementById('graph_id'), theme);
      BarGraph.setOption({  
       // properties that are set for the echart 'graph_id'
      });
    </script>

display: block; 使div可见但设置的echart属性不渲染。 div 显示为空白。可能是什么原因？我想不通。请帮忙。谢谢:)

****************************** 编辑 ******************* *********************
此外，我认为标题可能具有误导性，因为我能够隐藏加载的 div 并在单击时显示它。但是后来的渲染是我面临某些问题的地方。

Answer 1

显示 div 后重新渲染条形图