DIV 每分钟可见 10 秒答案

【问题标题】：DIV visible every minute for 10 secondsDIV 每分钟可见 10 秒
【发布时间】：2020-08-22 18:22:39
【问题描述】：

我需要你帮助我。当然对你来说这很容易，但是......花了一段时间，我做不到。

我有一个始终可见的 DIV，我希望另一个 DIV 每分钟出现 10 秒，然后隐藏，直到它必须再次出现（在另一个 DIV 被隐藏后经过一分钟后）。所以没完没了地重复。

我该怎么做？谢谢。

【问题讨论】：

第一个 DIV 在您的问题中的作用是什么？你的尝试是什么。请显示您的尝试（代码）以及您卡在哪里？你读过setTimeout吗？
发布您尝试过的代码的相关部分，展示您遇到的错误以及您所做的努力。 SO 不是：编写代码服务。
我有一个带有视频的主 DIV，我希望每分钟显示另一个 DIV，时间为 10 秒，然后消失。一旦它在 1 分钟后消失，时间就会重新出现，以此类推。我被困住了。

标签： javascript html jquery dom

【解决方案1】：

您可以将setTimeout() 函数与setInterval() 函数一起用于此任务。

setInterval(()=>{
   //make the div visible here
   setTimeout(()=>{
     //Make div invisible here
   }, 10 * 1000)//This is in milliseconds
}, 60 * 1000)

setInterval() 函数将每分钟连续执行一次。

【讨论】：

感谢您的帮助，但是这样第二轮会越来越短。它从 60 秒开始，在 10 秒时被移除，但下一个不是从 60 秒开始，因为它被移除了，但它出现在 50 秒

【解决方案2】：

您还可以使用递归函数，该函数使用两个 setTimeout() 并调用自身，因此它会在隐藏后等待整整一分钟，然后再重新开始

function showHide() {
  setTimeout(() => {
    // show element here

    setTimeout(() => {
        //hide element here then            
        // start all over by calling same function
        showHide();
      }, 10 * 1000);

  }, 60 * 1000);
}

// call it once to start
showHide()

【讨论】：

【解决方案3】：

尝试使用setTimeout 和setInterval 来显示或隐藏特定的div。可以参考setTimeout和setInterval

此外，你可以使用JS隐藏和显示div，

隐藏：

document.getElementById('<DIV_ID_HERE>').style.display = 'none'

显示：

document.getElementById('<DIV_ID_HERE>').style.display = 'block'

【讨论】：