1
我正在嘗試使用jQuery和css規則更改表上第一個可見行的css樣式。對錶上第一個可見行重新應用css規則
當我更改偏移量時，我想使用我的css規則以紅色顯示第一個可見表TBODY行。
這是我的代碼示例：
$(document).ready(function(){
$('input').on('change',function(){
$.each($("tbody>tr"), function(index, element) {
offset = $('input').val();
if(index < offset){
$("#row-"+index).removeClass('is-visible');
}else{
$("#row-"+index).addClass('is-visible');
}
});
})
});table tbody>tr{
display:none;
}
table tbody>tr.is-visible{
display:block;
}
table tr.is-visible:first-child{
background-color: #f00;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
offset : <input type="number" min="0" max="100">
<hr>
<table class="table">
\t <thead>
\t \t <tr>
\t \t \t <th>TH 1</th>
\t \t \t <th>TH 2</th>
\t \t \t <th>TH 3</th>
\t \t </tr>
\t </thead>
\t <tbody>
\t \t <tr class="is-visible" id="row-0">
\t \t \t <td>0</td>
\t \t \t <td>0</td>
\t \t \t <td>0</td>
\t \t </tr>
<tr class="is-visible" id="row-1">
\t \t \t <td>1</td>
\t \t \t <td>1</td>
\t \t \t <td>1</td>
\t \t </tr>
\t \t <tr class="is-visible" id="row-2">
\t \t \t <td>2</td>
\t \t \t <td>2</td>
\t \t \t <td>2</td>
\t \t </tr>
\t \t <tr class="is-visible" id="row-3">
\t \t \t <td>3</td>
\t \t \t <td>3</td>
\t \t \t <td>3</td>
\t \t </tr>
\t \t <tr class="is-visible" id="row-4">
\t \t \t <td>4</td>
\t \t \t <td>4</td>
\t \t \t <td>4</td>
\t \t </tr>
\t \t <tr class="is-visible" id="row-5">
\t \t \t <td>5</td>
\t \t \t <td>5</td>
\t \t \t <td>5</td>
\t \t </tr>
\t </tbody>
</table>感謝您的幫助。