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」

回答

相關問題