javascript - Javascript，除非先运行警报（），否则睡眠时图像不会改变

Question

我有一个图像，当我将其放入绘制的框中时会改变颜色。

一旦有人把它放进盒子里，我就会进入下一个屏幕。但我希望先有一个短暂的等待。

但是当我介绍等待时..图像不会改变颜色..即使它确认颜色改变代码已经运行。

但是..如果我设置了一个警报（“hi”）；在停止引擎的代码之前..然后颜色变化发生在等待会话之前。

就好像 alert(); 正在幕后做一些事情，导致 div 的颜色变化正确发生。

如何在运行 sleep 方法之前强制发生这种颜色变化？

有点像运行警报，而不必实际弹出警报。

Answer 1

没有睡眠方法，所以我猜您正在使用 while 循环进行“睡眠”。while 循环锁定浏览器并阻止页面更新。警报会稍微延迟并允许页面更新。

您需要做的是分解您的代码并使用 setTimeout 进行“睡眠”。

var img = document.getElementById("myImg");
img.src = "foo.gif";
function nextStep() {
    alert("do your next step here");
}

window.setTimeout(nextStep, 2000); //2 seconds