保持相同的高度和寬度的文本後（「」）

Question

Fiddle Example

Updated Example

會有人請告訴我如何使表保持高度和寬度相同的內容被刪除後。我想確保表格中的每個td,th,tr在使用text()清除內容後不會發生一點變化。我想這樣做的原因是因爲在從AJAX注入數據後，表格固定標頭腳本有一些滾動問題。我需要看看text();之後高度和寬度的變化是否是問題的原因。

我的嘗試在每次點擊時都會縮小表格。

$('#cleartable').on('click', function() { 

    var clear = $(".toptable td,.toptable th"); 
    var tableheight,tablewidth; 
    clear.each(function(){ 
    tableheight = $(this).height(),tablewidth = $(this).width(); 

    }); 
    clear.filter(function() { 
     return $(this).index() !== 0;  
    }).text(''); 
    clear.css("width",tablewidth).css("height",tableheight); 

}); 

HTML：

<button id="cleartable">Change</button> 
<table class="toptable"> 
    <tr> 
     <th class="image">-</th> 
     <th class="image">-</th> 
     <th class="image">-</th> 
    </tr> 
    <tr> 
     <td class="description">Name</td> 
     <td class="description">Alan</td> 
     <td class="description">John</td> 
    </tr> 
    <tr> 
     <td class="title">Age</td> 
     <td class="title">8</td> 
     <td class="title">9</td> 
    </tr> 
</table> 

Answer 1

指定的<td>元件（使用在這種情況下，.css()方法）在刪除文本的內容之前的height/width：

$('#cleartable').on('click', function() { 
    // selecting the td:first-child elements 
    $('table.toptable td:first-child') 
    // moving to select the siblings: 
    .siblings() 
    // adjusting the css: 
    .css({ 
     // i: the index of the current element over which we're iterating, 
     // h: the current value of the property we're manipulating (before adjustment), 
     // these names are arbitrary, and can be anything (I use these variable-names 
     // simply as a matter of personal taste, to represent the property I'm working 
     // with): 
     'height' : function(i,h){ 
      return h 
     }, 
     'width' : function(i,w){ 
      return w 
     } 
    }).text(''); 
}); 

JS Fiddle demo 。

參考文獻：

• css()。
• siblings()。