Knockout JS表hilight

Question

我正在尝试使用jQuery在表中添加交替颜色.问题是我正在使用Knockout,并且当每个样式都应用于所有tr时.我的问题在这里:http://jsfiddle.net/PUc3J/2/

$(function(){
    $(".tk-table tbody tr")
        .each(function(i){
            if(i % 2 == 0){
                $(this).addClass('hilight');
            }
        })
});

谢谢

Answer 1

只要您不关心支持Internet Explorer 8或更低版本,您就可以单独使用CSS来完成备用表行颜色.

http://jsfiddle.net/GJw7R/

.tk-table tbody tr:nth-child(odd) {
    background-color: #eaeded;
}

参考文献:
1. http://davidwalsh.name/css-tables-css3-alternate-row-colors
2. Twitter的引导表
3. 我可以使用- CSS3选择器

或者,您可以避免使用jQuery并在Knockout中使用 css绑定.

http://jsfiddle.net/9UDkg/

<tbody data-bind="foreach: data">
    <tr data-bind="css: $index() % 2 === 0 ? 'hilight' : ''">
        <td><p data-bind="text: online"></p></td>
        <td><p data-bind="text: name"></p></td>
        <td><p data-bind="text: email"></p></td>
    </tr>
</tbody>

...要么...

http://jsfiddle.net/ZDDrT/

<tr data-bind="css: {'hilight': $index() % 2 === 0}">