更改表行背景颜色-Java 学习之路

我正在使用以下代码尝试更改给定时间间隔的行的背景颜色：

var $tr = $tableBody.find('tr[id=' + id + ']');

setTimeout(function () {
    $tr.css("background-color", "red");
    $tr.effect("highlight", {}, 2000);
}, 1000);

不幸的是，上述情况无效 .

添加行时是否需要 css ？或者通过定义样式有更好的方法吗？

EDIT 这是一个例子JSFIDDLE

3 回答

更新：这是一个工作jsfiddle，点击工作 .

您的代码问题是您在每次 var 声明后使用 ','

$(document).ready(function() {
    $('#myTable').on('click',function(){
      var $tbl = $('#myTable');
      var $tblbody = $tbl.find('tbody');
      var $tr = $tblbody.find('tr[id=' + 1 + ']');

      $tr.addClass('highlight');
    });

})

回复于 2024-05-02T06:46:20+08:00

1
我建议不要直接改变CSS元素，而是在CSS样式表中设置的元素中添加一个类：

// CSS
```
.highlight{background-color:red}
```
// JS将高亮类添加到行中
```
$('#' + id).addClass('highlight');
```
//设置超时以在给定时间范围后删除突出显示类（在此示例中为2秒）：
```
setTimeout(function(){
    $('#' + id).removeClass('highlight')}, 2000)
```
这样你就不会改变它的CSS - 你可以多次使用高亮类，也可以使用其他东西 .

请注意，您需要确定addClass方面的触发器 - 否则这将在页面加载时添加它，并且像所有jQuery实例一样 - 您需要将jquery库添加到页面和$（document）.ready（function（）{ }）包装所有它 .
回复于 2024-05-02T06:46:20+08:00
1
我想你在找
```
setTimeout(function () {
    $tr.effect( "highlight", { color: "red" }, 2000 );
}, 1000);
```
另外，请确保您还包括jquery UI库:)

看到这个JSFIDDLE
回复于 2024-05-02T06:46:20+08:00

更改表行背景颜色

3 回答

相关问题