javascript - 将 div 更改为不同的颜色，等待 3 秒，然后使用 jQuery 将颜色改回

Question

我有一个 jQuery 代码，假设将 div 设为蓝色，然后等待 3 秒，然后再将其变回黑色。但它只是保持原来的颜色，黑色，在变回黑色之前根本没有变成蓝色。我究竟做错了什么？

<div id = "div" style="width:250px;height:250px; background-color:black;"></div>

$(function(){

$("#div").css({"background-color" : "blue"})
         .delay(3000)
         .css({"background-color" : "black"});

}) //end of $(function())

这是一个 fiddle :http://fiddle.jshell.net/5wjy9aqu/1/

Answer 1

这是因为 delay 不是那样工作的。

你总是可以这样做:

$('#div').css("background-color", "blue");
setTimeout(function(){
    $('#div').css("background-color", "black");
}, 3000);

如果你真的坚持delay，你也可以使用queue。

$('div').css('background-color', 'blue').delay(3000).queue(function(){
     $(this).css('background-color', 'black');
     $(this).dequeue();
});

如果你问我，那不是一个好的选择。