javascript 一次拥有更多功能答案

【问题标题】：javascript more functions in one timejavascript 一次拥有更多功能
【发布时间】：2023-03-14 23:42:01
【问题描述】：

对于一个学校项目，我需要为多个设备制作第二个屏幕。我会假装屏幕随时间变化。所以让我们说在 10 分钟它必须显示这个 div id=one，在 20 分钟它必须显示 div id=2。不幸的是我的代码不起作用，我找不到问题。也许我认为的方式也不正确。

欢迎您提供反馈，并在此先感谢您

  var counter = 0;
   var i = setInterval(function(){
    // do your thing

    counter++;
    if(counter === 1000) {
        document.getElementById("DoeDitVooralWelThuis").style.display ="block";
      document.getElementById("remaintime").style.display ="none";
    }
    counter++;
    if(counter === 2000) {
        document.getElementById("ExperimentArea").style.display ="block";
      document.getElementById("DoeDitVooralWelThuis").style.display ="none";
    }
 `enter code here`};

【问题讨论】：

当前运行它时实际发生了什么？首先，您已将其设置为运行 1 秒和 2 秒。
您要么没有提供完整的代码，要么是格式错误的 javascript。 setInterval 的参数列表未关闭且没有延迟值。此外，setTimeout 更适合。

标签： javascript function time counter

【解决方案1】：

不需要第二个counter++。
您的代码中还存在语法错误，例如未闭合的括号。

要使屏幕在 10 分钟和 20 分钟之间变化，您需要使用
if(counter === (1000 * 60) * 10) {

1000 等于 1000 毫秒，也就是一秒。所以你必须乘以六十得到一分钟，然后乘以十得到十分钟。二十也一样。

window.onload = function()
{
    var counter = 0;
    var i = setInterval(function(){

    counter++;
    if(counter === (1000 * 60) * 10) {
        document.getElementById("secondScreenElement").style.display ="block";
        document.getElementById("firstScreenElement").style.display ="none";
    }

    if(counter === (2000 * 60) * 10) {
        document.getElementById("secondScreenElement").style.display ="none";
        document.getElementById("thirdScreenElement").style.display ="block";
        clearInterval(i);
    }
 });
};

如果您想在显示最后一个屏幕后停止在屏幕之间切换，您可以使用clearInterval 并将setInterval 的值传递给它。即 - clearInterval(i);

在这里工作JSFiddle。我在这个小提琴中用了 1 秒和 2 秒。

【讨论】：

没问题 :) 一定要喜欢那些学校项目。

【解决方案2】：

您可以尝试使用setTimeout() 设置计时器。

function showFirst() {
    document.getElementById("DoeDitVooralWelThuis").style.display ="block";
    document.getElementById("remaintime").style.display ="none";
}
setTimeout(showFirst, 600000);//after 10 minutes

function showSecond() {
    document.getElementById("ExperimentArea").style.display ="block";
    document.getElementById("DoeDitVooralWelThuis").style.display ="none";
}
setTimeout(showSecond, 1200000);//after 20 minutes

【讨论】：

感谢您的帮助！赞赏