jquery dataTables插件在排序/过滤后能尊重不同的行颜色吗？
我正在使用jquery数据存储插件，它似乎是一个有用的插件，用于获取一个常规html表，并添加排序、过滤、分页等。
我看到的一个问题是，当我搜索时，它似乎没有更新“奇数”/“偶数”行类，所以如果我的表有100行，但是当我筛选它有10行时，可能是所有10都是相同的背景色，或者8是相同的背景色。
在按列排序之后，我也会看到同样的问题，在按列排序之后，它可能会用相同的背景色“堆叠”一堆行。
是否有数据插件可以在筛选器之后重新应用偶数/奇数样式，所以不管您正在筛选什么，总是有备用行背景色吗？
回答 4
Stack Overflow用户
发布于 2015-07-06 12:30:58
原因
默认情况下，此功能是可用的。最有可能的原因是这种不寻常的行为：
- 在CSS中覆盖
odd和even类，或者 - 筛选后，代码会影响表结构。
解决方案1
- 默认样式或jQuery UI或基础
对您的
display使用类<table>，如下所示。有关所有可用类的列表，请参见默认样式选项。 - 引导
将类
table table-striped table-bordered用于<table>，如下所示：
解决方案2
如果有一个覆盖odd和even类的CSS规则，您可以指示jQuery DataTables使用替代类而不是stripeClasses选项。
$('#example').DataTable( {
"stripeClasses": [ 'odd-row', 'even-row' ]
} );Stack Overflow用户
发布于 2015-07-06 08:29:44
要将其存档，您必须使用基本样式-没有样式类 datatable来完成此操作，只需从table tag中删除datatable类即可。
在此之后，为odd (例如myodd )和even(例如myeven )行创建自己的类。
现在，下一个任务是将这些类应用于每个表绘制方法中的表行：
1.应用过滤器时的
2.当可见记录的限制发生变化时，等。
要做到这一点，datatabe提供了rowCallback()，您可以这样使用：
$('#myTabel').dataTable({
"rowCallback": function( row, data, index ) {
if(index%2 == 0){
$(row).removeClass('myodd myeven');
$(row).addClass('myodd');
}else{
$(row).removeClass('myodd myeven');
$(row).addClass('myeven');
}
}
});请注意：
为了避免!important在css rule中为odd定义css rule，如下所示的even行：
table.dataTable tbody tr.myeven{
background-color:#f2dede;
}
table.dataTable tbody tr.myodd{
background-color:#bce8f1;
}演示： http://jsfiddle.net/ishandemon/4za80xky/
Stack Overflow用户
发布于 2017-07-06 09:22:15
我的这个注释适用于如何删除或修改Jquery行类
Datatable现在提供一个可选的json参数，名为为其1.10+文档定义的参数。
因此，如果您想要完全删除奇偶类，那么在表初始化期间使用以下参数。
$('#example').dataTable( {
"stripeClasses": [] //Empty Array.
} );因此，如果您想在数据表的每一行上应用自定义css类，那么。
$('#example').dataTable( {
"stripeClasses": ['yourRowClass']
} );如果您希望应用超过一个css类(以奇数偶数或顺序的方式)，那么这些类将在每第n行完成后重复它们-self，然后使用以下方法
$('#example').dataTable( {
"stripeClasses": [ 'strip1', 'strip2', 'strip3' ] //This combination will repeat always 3rd row
} );DataTables将按顺序应用每个类，在需要时循环。
https://stackoverflow.com/questions/30789911
复制相似问题
腾讯云开发者
