单击 <input type=file> 按钮后如何设置表格奇数/偶数行样式答案

【问题标题】：How to set table odd / even row styles after clicking <input type=file> button单击 <input type=file> 按钮后如何设置表格奇数/偶数行样式
【发布时间】：2013-02-20 20:44:28
【问题描述】：

我允许用户使用按钮将文件添加到页面。每个文件都作为新行添加到表中。我需要为奇数行和偶数行设置不同的背景颜色。我现在在我的风格中使用第 n 个孩子，但我需要 IE8 的解决方案。

在 IE 8 中：每次用户添加新文件时，我都需要表格来设置行的背景颜色。

到目前为止，这是我的代码：

<style>
 .OddRow {
    background: #eeeeee;   
    border-bottom: 1px solid #ccc;  
}

.EvenRow {
    background: #fff;     
    border-bottom: 1px solid #ccc;
}

</style>

        <span class="addfiles">
            <span>Add Files...</span>
            <input id="addFile" type="file" name="files[]" multiple>
        </span>

<table class="table table-striped">
    <tbody class="files"></tbody>
</table>

 <script>
    $(function () {
        $('#addFile').change(function () {
            $(".table table-striped tbody tr:even td").addClass('EvenRow');
            $(".table table-striped tbody tr:odd td").addClass('OddRow');
        });     
    });

 </script>

正在调用更改函数，但未应用行样式。我已经为 .addClass 代码尝试了许多事件和位置，所以我真的很感激对此的另一种看法。

谢谢。

【问题讨论】：

标签： jquery css input internet-explorer-8 input-type-file

【解决方案1】：

您选择的是td，而不是表格行本身。 table-striped 也没有正确定位（假设它是另一个类）。将您的 jQuery 选择器更改为

   $(".table.table-striped tbody tr:even").addClass('EvenRow');
    $(".table.table-striped tbody tr:odd").addClass('OddRow');

【讨论】：