jquery，css不申请表

Question

我使用表和一些css用户的外观和感觉。 而且这些表都做了一些其他jQuery插件一样的dataTable

http://www.datatables.net/

而且我的PHP代码如下

<table width="100%" id="top_visit_table"> 
    <thead> 
     <tr align="left"> 
      <th>Product Id</th><th>Product Name</th><th>Product Price</th><th>Number of Views</th> 
     </tr> 
    </thead> 
    <tbody> 
     <?php get_views_of_products($user_id);?> 
    </tbody>    
</table> 

而且下面是jQuery的CSS代码

<script type="text/javascript"> 
$(document).ready(function(){ 

$('#top_visit_table').dataTable(); 

    $("#top_visit_table tbody tr:even").addClass('tr_class'); // this gives color to table 
    $("#top_visit_table thead tr").addClass('tr_class_head'); // this gives color to table 

}); 

</script> 

和功能下面的代码

function get_views_of_products($user_id) { 

    $fquery12 = mysql_query("select p.products_id, pd.products_name, p.products_price, pd.products_viewed 
          from products p 
          INNER JOIN products_description pd ON pd.products_id = p.products_id 
          ORDER BY pd.products_viewed DESC 
          "); 

    while($fr12 = mysql_fetch_row($fquery12)) { 
     $price = substr($fr12[2], 0, -2); 
     echo "<tr>"; 
      echo "<td>$fr12[0]</td>"; 
      echo "<td>$fr12[1]</td>"; 
      echo "<td>$price</td>"; 
      echo "<td>$fr12[3]</td>"; 
     echo "</tr>"; 
    } 
} 

当我点击任何th元素，然后css排序并不适用于tr或td以下是图像，你可以把它理解清楚。

及以下

.tr_class { 
    background-color: #CCB; 
} 

.tr_class_head { 
    background-color: #CCE; 
} 

Answer 1

基本上你是使用类应用样式和datatables排序您的行与他们的类可能会导致3奇数行彼此相邻。我最近使用了数据表，我做了一些样式更改，但我不需要奇数和偶数行样式。你可以试试，但我不能保证它的成功：

tr:nth-child(even) {background: #CCC} 
tr:nth-child(odd) {background: #FFF} 

希望它有帮助。

Answer 2

您可以使用斑马小部件或尝试这一个你整理后的CSS代码：

$("#top_visit_table tbody tr").find("tr").removeClass("even").filter(":even").addClass("even");