JavaScript setTimeOut 似乎不像我期望的那样工作

IT技术 javascript
2021-02-16 21:55:59

这是我在 Chrome (localhost...) 下运行的一个简单的 JavaScript 文件。发生的情况是将 DIV 背景颜色设置为绿色，然后设置为红色，而只是将其设置为红色。第一个 setTimeout 似乎被忽略了。

<!DOCTYPE html>
<html lang="en">
<head>

<meta charset="utf-8">
<title>Set TimeOuts</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js">
</script> 
<script language="javascript">
function setBGColor()
{ 
var div1 = document.getElementById("div1");
setTimeout(setColor('yellow'),6000);
setTimeout(setColor('red'),6000); 
} 
function setColor(color)
{
    div1.style.backgroundColor=color; 
}
</script>
</head>
<body>
<div id="div1" onclick="setBGColor()";>THIS IS THE COLOR TEST</div> 
</body>
</html>

但是，如果我在 setColor 函数中放置一个警报（颜色），我可以看到 div bgcolor 首先变黄。此外，6000 也被忽略。为什么？

1个回答
setTimeout(setColor('yellow'),6000);

您正在调用 setColor('yellow')并将返回值（即undefined）传递给setTimeout。

你需要给它传递一个函数。

同样重要的是要注意这setTimeout将导致一个函数在一段时间后被调用。它不会让 JavaScript 在这段时间内休眠。

setTimeout(setColor.bind(window, 'yellow'),6000);
setTimeout(setColor.bind(window, 'red'),6000);

...将setTimeout在 0setTimeout秒调用，然后setColor('yellow')在几分之一秒后再次调用，然后在 6 秒和setColor('red')几分之一秒后调用。

setTimeout(function() { setColor("yellow"); }, 6000); 也可以接受
2021-05-10 21:55:59
其它你可能感兴趣的问题
上一篇nodejs、multer、aws S3 下一篇使用asp.net ajax时函数未定义错误