设置超时不以编程方式重置div元素颜色

Question

我试图在onclick事件后将div元素重置为白色，但效果不佳。 知道出了什么问题吗？ 它保持“卡在”红色。

$('.timeline-item').click(function() {
    $(this).css("background-color","red");
    setTimeout(function() {
        $(this).css("background-color","#FFFFFF");
    }, 250);
});

在这里摆弄

Answer 1

尝试此操作，保存对父范围的引用（ var _this = this ），因为在您的示例中， this引用是指window

$('.timeline-item').click(function() {
    var _this = this;

    $(this).css("background-color","red");
    setTimeout(function() {
        $(_this).css("background-color","#FFFFFF");
    }, 250);
});

Answer 2

this里面的超时是不是指该被点击的元件，而不是this引用window对象。

您可以使用闭包变量来保存对clicked元素的引用，然后在超时处理程序中使用它

$('.timeline-item').click(function() {
    var $this = $(this).css("background-color","red");
    setTimeout(function() {
        $this.css("background-color","#FFFFFF");
    }, 250);
});