重新繪製隱藏的HTML表格

Question

在頁面加載中我有一個包含在隱藏div中的表格。該表只有頁眉和頁腳定義，但沒有數據行。數據行使用Ajax動態加載。

一旦用戶點擊一個按鈕，將顯示包含該表（以及其他靜態文本）的隱藏div。我的問題是，表格佈局看起來不是很好，因爲我使用寬度= 100％，在開始時表格被隱藏，並開始使用寬度爲0的寬度。

理想情況下，我想知道是否有一種方法來強制重繪的表格，一旦div可見？

Answer 1

我假設你有類似下面的代碼：

success: function (response) { 
    $('mytable').html(response).show(); 
} 

爲什麼不顯示方法後，設置寬度，就像這樣：

success: function (response) { 
    $('mytable').html(response).show(); 
    $('mytable').css('width', '100%'); 
} 

Answer 2

我的建議是在樣式表CSS。有兩種策略我使用：

1. 我使用firebug來獲得正確的樣式，然後將其放入樣式表中。
2. 使用dumby數據放置表並將其與樣式表一起設置，然後稍後移動它。

Answer 3

您可以clone()該元素，然後刪除（）它，然後插入複製的克隆，並顯示它。

您可以用clone(true, true)兩個參數在再次插入時重新綁定所有事件。如果這不起作用，John Reisig本身還有另外一種方法：What is the most efficient way to deep clone an object in JavaScript?當clone（）不夠用時，這對我有用。從第一個答案中使用jQuery元素作爲「oldObject」。

例子：

// Deep copy 
var newObject = jQuery.extend(true, {}, $('#tableToClone')); 
$('#tableToClone').remove(); 
$('#divArroundTable').html(newObject);