我在我的HTML中使用KnockoutJS将表行的可见性数据绑定到某些可观察值,如我随附的JavaScript中所定义.我的表看起来像这样：
当应用程序运行时,可以通过使用这些数据绑定的值来隐藏或显示表的行.为了给表格的行交替颜色(斑马/条纹),我在CSS中定义了以下内容：
.myTable tr:nth-child(even) td {
background-color: black;
}
.myTable tr:nth-child(odd) td {
background-color: gray;
}
通常,这个CSS会正确地设置行的样式.偶数行将显示为黑色,奇数行将显示为灰色.但是,当您抛出Knockout数据绑定时,我的问题就出现了.
例如,假设我的数据绑定导致索引#2行被隐藏.即使该行被隐藏,我的< tr>该行的定义仍存在于表中.这会抛弃交替的行颜色.由于索引#2仍然存在,但是被隐藏,它仍然包含在交替的行颜色中.这意味着两个灰色行将显示在彼此之上.
有没有可以实现正确的交替表行颜色,同时仍然使用我的KnockoutJS模式？ KO数据绑定是否有一些技巧可以删除隐藏的< tr>完全来自Markup,以便正确应用CSS样式？
最佳答案
您可以使用虚拟元素<！ - ko'if'：thisRowVisible - >.
工作示例：http://jsfiddle.net/zs4B2/1/.
原文链接：https://www.f2er.com/css/427335.html
猜你在找的CSS相关文章
