Question

我在项目中使用了bootstrap。在每个选项卡中我显示一个图表，我的问题是div显示属性为none，用户点击 a 标记后，div显示变为该块。我也写了一个函数来处理显示图表。但是当用户点击标签图表时没有显示。但如果我删除display：none属性，它的显示没有问题。这是我的div：

<div id="bar" style="display: none">
   <?php echo chart($title,$data,'Bar');?>
</div>

这是我的图表功能：

function chart($title,$data,$type){
ob_start();
?>
<script src="<?php echo url()?>/assets/chart/Chart.min.js" type="text/javascript"></script>
<script src="<?php echo url()?>/assets/global/plugins/jquery.min.js" type="text/javascript"></script>
<canvas style="display: block;margin: 0 auto;" id="myCanvas" width="600" height="300"></canvas>
<script>
$(function(){
  var ctx = $('#myCanvas').get(0).getContext('2d');
  var barChartData = {
    labels : <?php echo json_encode($title) ?>,
    datasets : [
      {
        fillColor : "rgba(10, 150, 100, 0.8)",
        strokeColor : "rgba(24, 107, 2, 0.8)",
        highlightFill: "rgba(4, 20, 60, 0.9)",
        highlightStroke: "rgba(5, 35, 70, 1)",
        data : <?php echo json_encode($data) ?>
      }
    ]
  };
  var pieChart = new Chart(ctx).<?php echo $type?>(barChartData);
});
</script>
<?php
$view = ob_get_clean();
return $view;
}

这是在单击时显示div的脚本：

 $('#aBar').on('click',function(){
  $('#circle').css('display','none');
  $('#line').css('display','none');
  $('#bar').css('display','block');
});

Answer 1

解决。我只需要设置隐藏的可见性，当用户点击 a 标记时，将其设置为可见，一切正常。

div显示设置为阻止后无显示

1 个答案: