按鈕點擊時可見Google表格圖表

Question

試圖將Google表格圖表加載爲隱藏狀態，並且僅在按鈕點擊後才顯示。

如果我開始沒有隱藏我可以切換它的table的頁面，但如果我開始隱藏的表，它是不可能的。

這是​​3210。

交換的註釋行，看看它：

$("table").addClass('table-bordered table-condensed table-striped'); 
// $("table").addClass('table-bordered table-condensed table-striped hidden'); 

Answer 1

與此代碼

$(document).ready(function(){ 
    $("p").hide(); 
     $("#table").hide(); 
    $("#hide").click(function(){ 
     $("p").hide(); 
     $("#table").hide(); 
    }); 
    $("#show").click(function(){ 
     $("p").show(); 
     $("#table").show(); 
    }); 
}); 

Answer 2

使用CSS使表最初設置其display到none隱藏。

#table {display:none;} 

然後用jQuery .css把它的#show它的點擊時display回block。

$(document).ready(function(){ 
    $("#hide").click(function(){ 
     $("p").hide(); 
     $("#table").css('display', 'none'); 
    }); 
    $("#show").click(function(){ 
     $("p").show(); 
     $("#table").css('display', 'block'); 
    }); 
}); 

查看更新的fiddle。

Answer 3

你可以只刪除隱藏類單擊顯示按鈕時更改您的代碼：

$("table").removeClass('hidden');

（和被點擊隱藏時重新申請）。