bootstrap table-striped in multiple tbody with doubled tr

Question

我是簡單的表，我用bootstrap和classes表和表條紋。它運作良好。

<h3>Old table</h3> 
<table class="table table-striped"> 
    <thead> 
     <tr><th>Brand</th><th>Model</th></tr> 
    </thead> 
    <tbody> 
     <tr><td>Audi</td><td>A1</td></tr> 
     <tr><td>Audi</td><td>A2</td></tr> 
     <tr><td>Audi</td><td>A3</td></tr> 
     <tr><td>Audi</td><td>A4</td></tr> 
    </tbody>  
</table> 

但現在我有我的表複雜化並使用提交元素多TBODY（每個TBODY有兩個tr元素）。所以引導類表條帶化不起作用。 有什麼辦法可以在bootstrap中做到這一點？汽車行應該是表條紋但不是註釋行。

<h3>Current table</h3> 
<table class="table table-striped"> 
    <thead> 
     <tr><th>Brand</th><th>Model</th></tr> 
    </thead> 
    <tbody> 
     <tr><td>Audi</td><td>A1</td></tr> 
     <tr class="comment"><td colspan="2">Comment...</td></tr> 
    </tbody> 
    <tbody> 
     <tr><td>Audi</td><td>A2</td></tr> 
     <tr class="comment hide"><td colspan="2">Comment...</td></tr> 
    </tbody> 
    <tbody> 
     <tr><td>Audi</td><td>A3</td></tr> 
     <tr class="comment"><td colspan="2">Comment...</td></tr> 
    </tbody> 
    <tbody> 
     <tr><td>Audi</td><td>A4</td></tr> 
     <tr class="comment hide"><td colspan="2">Comment...</td></tr> 
    </tbody>  
</table> 

Plunker example

Answer 1

周圍的工作爲引導將遠不僅僅是在自己的自定義類將更加複雜。 bootstrap source爲table-striped只是使所有奇數行不同的顏色。這意味着如果你嘗試引導你爲自己做，而不是僅僅自己上課，那麼你可能會進一步深入並造成更多麻煩。

Answer 2

$('tbody').parents('.fixed-table-container').find('tr:even').addClass('even'); 

.even { background: #f9f9f9; } 

而且在bootstrap.min.css查找 - >.table-striped>tbody>tr:nth-of-type(odd){background-color:#f9f9f9}替換 - >.table-striped>tbody>tr:nth-of-type(odd){background-color:none}