javascript检查元素是否可见并相应地设置“setInterval”

LE2。任何其他想法如何解决这个问题？javascript检查元素是否可见并相应地设置“setInterval”

我有这样的代码，并想不通为什么工作不正常：

$(function autorun() { 

if ($("#contactForm").is(":visible")){ 
setInterval("refreshAjax();", 150000000000); 
} 
else { 
setInterval("refreshAjax();", 15000); 
} 
setTimeout("autorun();", 2000) 
});

...

<body onLoad="autorun()">

现在即使它不断刷新页面，每2秒， “contactForm”是可见的。

我的逻辑是：如果“contactForm”可见，则延迟刷新或停止刷新，继续检查，但同时相应地刷新页面到其他语句。

LE。

$(function() { 
refreshAjax = function(){$("#flex1").flexReload(); 
} 
});

LE2。最终的解决方案通过@Nick Craver提供here

$(function() { 
    var ajaxTimeout; 
    function autorun() { 
    if ($("#contactForm").is(":visible")){ 
     if(ajaxTimeout) { 
     clearInterval(ajaxTimeout); 
     ajaxTimeout = false; 
     } 
    } 
    else if(!ajaxTimeout) { 
     ajaxTimeout = setInterval(refreshAjax, 15000); 
    } 
    } 
    setInterval(autorun, 2000); 
});

感谢，克里斯蒂安。

来源

2010-10-30 Chris19

什么是自动运行和refreshAjax？为什么页面会每2秒刷新一次，而不是每1.5秒刷新一次？ – 2010-10-30 07:34:53

refreshAjax刷新flexigrid和自动运行我试图检查“contactForm”是否可见，所以我可以停止或继续刷新flexigrid。如果flexigrid在刷新时显示“contactForm”，则叠加层存在问题。谢谢。 – Chris19 2010-10-30 08:16:52

目前您正在创建很多不太好的间隔计时器。我不知道这是否能解决您的问题，因为除此之外，您的代码看起来不错。

试试看：

var ajaxTimeout; 

function autorun() { 
    if ($("#contactForm").is(":visible")){ 
     if(ajaxTimeout) { 
      clearInterval(ajaxTimeout); 
      ajaxTimeout = false; 
     } 
    } 
    else if(!ajaxTimeout) { 
     ajaxTimeout = setInterval(refreshAjax, 15000); 
    } 
} 


$(function() { 
    setInterval(autorun, 2000) 
});

记住，时间以毫秒为单位。

更新： @tec还有另一个有趣的解决方案。所以这取决于你实际想要用你的代码实现什么。

来源

2010-10-30 07:40:49

我在@tec答案中添加了更多信息作为评论。谢谢。 – Chris19 2010-10-30 07:54:21

使用setInterval（）的有趣解决方案。但我想你应该设置ajaxTimeout为0或false当你做clearInterval（）。否则，当contactForm不再可见时，不会再次调用refreshAjax。 – tec 2010-10-30 08:00:07

好吧，所以这个工作，但只有第一次“contactForm”是可见的。如果我在不刷新页面的情况下再次打开“contactForm”，它不会检查是否可见或隐藏，它会在15秒后保持刷新。有什么想法吗？谢谢，C。 – Chris19 2010-10-30 08:29:24

看起来你还没有完全理解setTimeout/setInterval的工作方式。首先你需要知道的是，这些方法总是异步工作。 Javascript代码永远不会停止并等待什么。相反，首先你的方法（和调用堆栈）完成;之后执行延迟的方法调用。我建议阅读javascript中的“穿线”的一个很好的解释：http://ejohn.org/blog/how-javascript-timers-work/

所以在你的代码中，每两秒调用一次autorun（）。每两秒钟评估一次。如果联系表单可见，则不会发生任何事情，因为我猜你不会等待15 Mio秒。如果它不可见，则开始以15秒的间隔调用refreshAjax（）。但请记住：这是每两秒钟完成一次。所以在15秒之后第一次调用refreshAjax（）。 17秒后和19,21后，依此类推。 30秒后，它开始每两秒调用两次。

简单的解决办法是这样的：

$(function autorun() { 
    if ($("#contactForm").is(":visible")){ 
    // It's visible, so don't do anything. 
    // But check again in two seconds if it is still visible. 
    setTimeout("autorun();", 2000); 
    } 
    else { 
    // it's not visible, yay! 
    // Let's refresh and check again in 15 seconds 
    setTimeout("autorun();", 15000); 
    refreshAjax(); // note that refreshAjax is called instantly, _not_ after 15 seconds 
    } 
});

来源

2010-10-30 07:42:22 tec

我使用flexigrid显示来自数据库的数据，我想使用滑块向下“contactForm”保存其他设置以便与其他代码一起使用。我的问题是，当“contactForm”是可见的，flexigrid刷新它重叠“contactForm”，它看起来非常糟糕。如果我尝试添加覆盖层来重叠柔性覆盖层，最终会重叠“contactFom”，因此我试图在“contactForm”处于活动状态时使用上面的脚本停止刷新flexigrid。最初，“contactForm”是隐藏的，所以我需要修改代码。谢谢。 – Chris19 2010-10-30 07:53:02

javascript检查元素是否可见并相应地设置“setInterval”

回答

相关问题