後div顯示設置爲阻止任何顯示

我在我的項目中使用bootstrap。在每個標籤中，我顯示一個圖表，我的問題是div顯示屬性是none，用戶單擊a標籤div顯示變爲該塊。我還寫了一個函數來處理顯示圖表。但是當用戶點擊不顯示的選項卡圖表時。但如果我刪除display：none屬性顯示沒有問題。這是我的div：後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; 
}

，這是顯示其股利時，點擊腳本：

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

來源

2015-11-15 hossein ahmadi

點擊時顯示#bar的腳本在哪裏？ – Pete

它現在被添加。 –

我猜無論你用於圖表的插件，它正在使用容器維度，而獲得初始化。一旦元素可見，您應該初始化插件，或者使用其他方式在viewport之外設置元素，而不是「display：none」 –

解決。我只需設置隱藏的可見性，當用戶點擊一個標籤設置爲可見，一切都沒問題。

來源

2015-11-15 12:45:09

後div顯示設置爲阻止任何顯示

回答

相關問題