标签不活动时 Javascript 不工作答案

【问题标题】：Javascript Not Working When Tab Not Active标签不活动时 Javascript 不工作
【发布时间】：2016-03-09 02:02:33
【问题描述】：

所以，当我在活动浏览器选项卡中查看它时，我这里有一个代码可以正常工作。但是，一旦我最小化或在浏览器的其他选项卡（顺便说一下是 chrome）之间切换，代码就会开始出现问题。下面是代码：

var a = document.getElementById("slidermain");
var b = a.getElementsByTagName("IMG");
var len = b.length;

var noOpac = 0;
var fullOpac = 10;
var imgNumb = 0;

function initFade(count){
    imgNumb = imgNumb + count;
    if(imgNumb < 0){
        imgNumb = len;  
    }
    if(imgNumb > len){
        imgNumb = 1;    
    }
    elem = b[imgNumb-1];
    startFadeEffect(elem);
}

function startFadeEffect(elem){
    var opacSetting = noOpac / 10;
    if(noOpac > 10){
        opacSetting = 1;    
    }
    elem.style.opacity = opacSetting;   
    elem.style.display = "block";
    noOpac++;
    var timer = setTimeout(function() { startFadeEffect(elem); }, 55);
    if(opacSetting == 1){
        clearTimeout(timer);
        elem.style.opacity = 1;
        noOpac = 0;
        setTimeout(function() { endFadeEffect(elem); }, 2000);
    }
}

function endFadeEffect(elem){
    var opacSetting = fullOpac / 10;
    if(fullOpac < 0){
        opacSetting = 0;    
    }
    elem.style.opacity = opacSetting;   
    fullOpac--;
    var timer = setTimeout(function() { endFadeEffect(elem); }, 55);
    if(opacSetting == 0){
        clearTimeout(timer);
        elem.style.opacity = 0;
        elem.style.display = "none";
        fullOpac = 10;
        return false;
    }
}

function autoFade(){
    var loop = setInterval("initFade(1)", 4000);    
}

请不要说我一直在这个网站上寻找答案，但我发现的大多是基于 JQuery 的解决方案；但是，我正在寻找一种仅限 JavaScript 的解决方案，在这种解决方案中我可能不必使用获取新日期函数。请不要将我的问题标记为重复，因为我已经做了很好的研究。谢谢！

【问题讨论】：

我必须看到这个的发布版本。听起来很有趣，我从来没有遇到过这种情况。另外，我非常怀疑上面的代码是否会导致这种情况。我必须是您提供的代码之外的问题。另外..您到底遇到了什么问题？
How can I make setInterval also work when a tab is inactive in Chrome? 的可能重复项。此外，您需要详细描述“问题”。为什么您的问题不是与“本网站上几乎所有相关问题”的重复？
我告诉过你我正在寻找唯一的 JS 解决方案，那就是 JQuery！ :(另外，我正在寻找一个现在或之前不需要的解决方案。
@AlphaG33k 请问你在代码之外是什么意思，如果你能指定我可以更好地解释你吗？谢谢...
@zero298 提供的答案不是使用 jQuery 来解决问题。 It stores the time as a variable outside the setInterval function and uses this to determine whether time has elapsed outside of the execution (i.e. when the tab is inactive)

标签： javascript html fadein fadeout

【解决方案1】：

这不是您的 javascript 的问题，而是 Chrome 的问题。当您的标签页处于非活动状态时，Chrome 会对其进行一些奇怪的操作。添加代码以“修复混乱”，或说明选项卡未处于活动状态，以便在退出和重新进入后恢复。

【讨论】：

例如，只要您超时，您的计时器就不会运行。您可以添加代码以将计时器与时钟同步，以调整时间错误。