Question

我在Bootstrap中有一个动态表。想法是在点击时更改行颜色。 Firebug告诉我正在应用“selectedRow”类，但行不会改变颜色。

HTML

<div class="row">
    <div class="col-sm-12" style="background-color:  color: rgb(244, 244, 243);">
        <div class="table-responsive">
            <table id="daTable" class="table">
                <thead>
                    <tr><th>xxxxx</th>
                    <th>yyyyy</th></tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </div>
</div>

JS

var tabl = document.getElementById("daTable");
for (var i = 0; i <data.length; i++) {
    var d= data[i];
    tableRow(tabl, [d.field1, d.field2]);           
}

$(tabl).on('click', '.clickable-row', function(event) {
    $(this).addClass("selectedRow");
    $(this).find('td').addClass("selectedRow");    
});

CSS

.selectedRow {
    background-color:red !important;
}

由于

Answer 1

我没看到您将clickable-row类应用于表行的位置。如果你这样做会怎么样：

$('#daTable tr').on('click', function(event) {
     $(this).toggleClass("selectedRow");
});

Answer 2

我的坏。在CSS中有一个拼写错误。无论如何，谢谢

关于jQuery addClass的表行没有使用Bootstrap

2 个答案: