JQuery用rowspan隱藏表列

Question

我想隱藏表列，但在具有rowspan屬性的列上使用jQuery .hide()或.toggle()似乎將該屬性「傳遞」到前一行並弄亂了表格。

$('#toggle').click(function(){ 
    $('#tbl td:last-child').toggle(); 
}); 

看在簡單的例子： http://jsfiddle.net/SEwVP/

任何想法？

Answer 1

感謝@dystroy的輸入。

基於他的答案，這裏的簡單的解決辦法：

var lastChilds = $('#tbl td:last-child'); 
lastChilds.each(function(i){ 
    var rowSpan = $(this).attr('rowspan'); 
    if(rowSpan !== undefined){ 
     lastChilds.splice(i+1, rowSpan-1); 
    } 
    $(this).hide(); 
    }); 

Answer 2

最後的td可能是不同的列，所以這很正常。

在這種情況下只有最後一列保持rowspans，你可以使用子指數：

$('#toggle').click(function(){ 
    $('#tbl td:nth-child(5)').toggle(); 
}); 

如果你想一個解決方案有效的，如果你在任何一列都行跨度，那麼你可能要爲每個單元格預先計算其實際列索引。這是可行的，但更多的是使用更簡單的解決方案可能更合理，例如根據數據有一個類。因此它將取決於你的表的語義和生產過程。