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

Question

我试图在onclick事件后将div元素重置为白色，但收效甚微。什么出了什么问题？它一直“卡住”红色。

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

Fiddle here

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对象。

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

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