Rowspan > 1 的表格样式

Question

我有这张表，我已经将它设置为第一列中有不少单元格的 rowspan 大于 1。这会导致我使用的样式出现问题：

tbody > tr:nth-of-type(odd) {
    background-color:#55f
}

如何设置它以便第一列单元格样式的任何行？我已经设置了一个小提琴，因为我不知道如何解释它。

在 fiddle 中有 2 个表，顶部是发生的事情，底部是我想要发生的事情（没有内联样式）

http://jsfiddle.net/qLrauoxc/1/

Answer 1

一个表中可以有多个 tbody。如果在您的情况下有意义，您可以使用它们对您的 tr 进行分组，并在 tbody:nth-of-type(odd) 上应用背景颜色。

Answer 2

更新：UPDATED FIDDLE

使用jQuery。

counter 变量将代表#one <tbody> 上所有<tr> 中的所有第一个<td>。
restricted 变量将表示具有 rowspan 设置属性的 <td> 的跨度，以及将被跳过的 <tr>s 的数量。
flag 变量将表示跳过（奇数或偶数）。

注意：将初始标志更改为 1，将使突出显示从将找到的第二个开始（偶数）。

jQuery:

     $(document).ready(function(){
    var counter = 1;
    var restricted = 0;
    var flag = 0;
    $("#one tbody > tr td:first-child").each(function(){
        var x = $(this).attr("rowspan");
        if(counter > restricted){
        if(flag == 0){
        $(this).parent().css({"background-color":"#f0f"});
        if (typeof x !== typeof undefined && x !== false) { 
            var $selector = $(this).parent();
            for(var i=1;i<x;i++){
                $selector.next('tr').css({"background-color":"#f0f"});
                $selector = $selector.next('tr');
            }
            if(flag == 0){
                flag = 1;
            }
            restricted = restricted + parseInt(x);
        }  
        else{
            restricted = restricted + 1;
            if(flag == 0){
                flag = 1;
            }
        }       
    }
    else if(flag == 1){
        var x = $(this).attr("rowspan");
        if (typeof x !== typeof undefined && x !== false) { 
            restricted = parseInt(restricted) + parseInt(x);
        }    
        else{
            restricted = restricted + 1;
        }
       flag = 0;
    } 
    }
        counter++;        
    });
});

UPDATED JSFIDDLE