Javascript 表行的奇偶类

我有一个表，其中有行，中间有隐藏行，因为奇偶css类无法设置。如何避免这些隐藏行

HTML

<tr class="oddRow">
     <td>Avinash</td>
     <td>18-Jun-2010</td>
     <td>LI1004</td>
     <td>5,600.00</td>
     <td>Sort</td>
</tr><tr class="oddRow" style="display:none;">
     <td>Ajith</td>
     <td>18-Jun-2010</td>
     <td>LI1006</td>
     <td>5,001.00</td>
     <td>!</td>
</tr><tr class="evenRow">
     <td>Ankur</td>
     <td>14-Jun-2010</td>
     <td>LI1005</td>
     <td>5,000.00</td>
     <td>me</td>
</tr><tr class="oddRow">
     <td>Ajith</td>
     <td>18-Jun-2010</td>
     <td>LI1006</td>
     <td>5,001.00</td>
     <td>!</td>
</tr>

阿维纳什
2010年6月18日
LI1004
5,600.00
分类
阿吉思
2010年6月18日
LI1006
5,001.00
!
安克尔
2010年6月14日
LI1005
5,000.00
我
阿吉思
2010年6月18日
LI1006
5,001.00
!

假设您的问题是问我在评论中发布了什么，那么您必须有一个更深入的“隐藏”函数，它将更改所有后续函数的类。我想你会想用这样的东西：

function hideRow(rowNum)
{
    var rows = document.getElementById('table-id').getElementsByTagName('table');

    // get current class and hide the row
    var currentClass = rows[rowNum].className;
    rows[rowNum].style.display = 'none';

    // set up classname array
    var classNames = new Array("oddRow", "evenRow");
    // make sure 'j' points to the next desired classname
    var j = 0;
    if (classNames[j] == currentClass)
        j = 1;

    // make all subsequent visible rows alternate
    for (i=rowNum+1; i<rows.length; i++)
    {
        // ignore empty rows
        if (rows[i].currentStyle.display == "none")
            continue;

        // set class name
        rows[i].className = classNames[j];
        j = (j+1) % 2;
    }
}

函数hideRow（rowNum）
{
var rows=document.getElementById（'table-id'）.getElementsByTagName（'table'）；
//获取当前类并隐藏该行
var currentClass=rows[rowNum].className；
行[rowNum].style.display='none'；
//设置类名数组
var classNames=新数组（“oddRow”、“evenRow”）；
//确保“j”指向下一个所需的类名
var j=0；
if（类名[j]==currentClass）
j=1；
//使所有后续可见行交替
对于（i=rowNum+1；i我知道这没有标记jQuery，但这将是应用此解决方案的最简单方法

这里不需要两个CSS类（奇数和偶数），只需要一个。首先，将每行的CSS设置为默认使用“oddRow”样式声明。“evenRow”样式声明只需覆盖默认值即可

添加这个JS函数

var zebraStripes = function($) {
    $('table.stripes tr').removeClass('evenRow')
        .filter(':visible:odd').addClass('evenRow');
    // using the :odd selector as it is zero-based
}

然后可以将此函数绑定到document ready事件以及任何更改行可见性的事件

编辑
更新为使用jQuery 1.7，示例-
为什么首先隐藏行？如何隐藏它们？我们可以看到HTML输出吗？@prakash，不是在注释中。在您的原始问题中。@prakash为什么有两个oddRows，一个接一个？为什么第二个有
style=“display:none；”
？我想他希望他的行可以交替使用样式（可能是BG颜色）但问题是他需要通过JS隐藏行的能力。当他这样做时，这打破了奇偶样式的布局。我相信他要问的是如何使他能够动态隐藏行，但仍然可以交替行样式。为什么你把函数放在一个变量中，而不是像
function zebrastripes（）{}
？@Mala在这种情况下，它不会有太大区别-我不明白为什么，但这个答案不起作用。这里是我的解决方案：
$（'table.stripes tr:visible'）。每个（函数（索引，行）{if（索引%2==1）{$（row.addClass（'evenRow'）；}）哦，现在你有了奇偶选择器。非常感谢你，菲尔！