我有 3 个 div:div0(绿色)、div1(黄色)、div2(红色)。一切都是相互重叠的。我使用 setInterval 每秒隐藏和显示 div1 和 div2。如果索引 = 4 或 6，则显示红色 div，否则显示黄色 div。通过我的下面的代码，它发生得很好。
我的要求是，当index变为8时，我想暂停setInterval 1分钟，直到显示div0(绿色)，然后恢复setInterval循环，直到调用clearInterval。
如何在这里暂停 setInterval 并显示绿色 mask ？
<!DOCTYPE html>
<html lang="en">
<head>
<title>Sample Application</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
var index=0;
$(document).ready(function(){
hideDiv();
var auto_refresh = setInterval(function() {
index+=1;
//if(index = 8)
//{
//code to pause the setInterval for 60 seconds and show div0
//}
if(index == 4 || index==6)
{
showDiv2();
}
else
{
showDiv1();
}
if (index > 9)
{
clearInterval(auto_refresh);
}
}, 1000);
});
function hideDiv()
{
document.getElementById("div0").style.visibility="hidden";
document.getElementById("div1").style.visibility="hidden";
document.getElementById("div2").style.visibility="hidden";
}
function showDiv0()
{
document.getElementById("div0").style.visibility="visible";
document.getElementById("div1").style.visibility="hidden";
document.getElementById("div2").style.visibility="hidden";
}
function showDiv1()
{
document.getElementById("div1").style.visibility="visible";
document.getElementById("div0").style.visibility="hidden";
document.getElementById("div2").style.visibility="hidden";
document.getElementById("div1").innerHTML=index;
}
function showDiv2()
{
document.getElementById("div2").style.visibility="visible";
document.getElementById("div0").style.visibility="hidden";
document.getElementById("div1").style.visibility="hidden";
document.getElementById("div2").innerHTML=index;
}
</script>
</head>
<body>
<div id="container" style="position:relative;">
<div id="div0" style="background:green;height:200px;width:200px;margin:0;position:absolute">Relaxing for a minute</div>
<div id="div1" style="background:yellow;height:200px;width:200px;margin:0;position:absolute">This is div1</div>
<div id="div2" style="background:red;height:200px;width:200px;margin:0;position:absolute">This is div2</div>
</div>
</body>
</html>
最佳答案
当为8时，清除间隔并使用设置为分钟的setTimeout来调用显示绿色的代码
关于javascript - 如何在javascript中暂停setInterval一段时间？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/19494118/