2011-04-23 14 views
18

पृष्ठ सक्रिय नहीं होने पर setTimeout("myfunction()",10000); को गिनने से रोकने का कोई तरीका है। उदाहरण के लिए,केवल तभी सेट करें जब टैब सक्रिय हो

  1. एक उपयोगकर्ता एक "कुछ पेज" पर आता है और के लिए 2000ms
  2. उपयोगकर्ता रहता है किसी अन्य टैब पर चला जाता है, छोड़ देता है "कुछ पृष्ठ" खुला।
  3. myfunction() तब तक आग नहीं लगाता जब तक कि वे 8000ms के लिए वापस नहीं आते।

उत्तर

34

ये रहा:

(function() { 
    var time = 10000, 
     delta = 100, 
     tid; 

    tid = setInterval(function() { 
     if (window.blurred) { return; }  
     time -= delta; 
     if (time <= 0) { 
      clearInterval(tid); 
      myFunction(); // time passed - do your work 
     } 
    }, delta); 
})(); 

window.onblur = function() { window.blurred = true; }; 
window.onfocus = function() { window.blurred = false; }; 

लाइव डेमो:http://jsfiddle.net/simevidas/J68dJ/3/show/

+0

जब तक कि मुझे कुछ याद नहीं आ रहा है, यह पृष्ठ पर क्लिक जैसे किसी भी उपयोगकर्ता इंटरैक्शन से पहले प्रारंभिक पृष्ठ लोड पर अंतराल कार्यों को नहीं चलाएगा, क्योंकि 'ऑनफोकस' ईवेंट प्रारंभिक पृष्ठ लोड पर आग लगने वाला नहीं है। –

+0

@torazaburo प्रारंभ में, 'window.blurred'' अपरिभाषित 'होगा, जैसा कि यह' झूठा 'जैसा ही है। इसलिए, टाइमर स्वचालित रूप से गिनती शुरू होता है। ध्यान दें कि 'setInterval' तुरंत कैसे निष्पादित करता है - यह फ़ोकस या धुंध होने की प्रतीक्षा नहीं करता है। –

+1

आप document.hidden का उपयोग कर सकते हैं: https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API#document.hidden_Read_only – SleepWalker

0

आपको क्या करना होगा, कुल अंतराल के समय को ट्रैक करते हुए, छोटे अंतराल पर टाइमआउट सेट करने के लिए एक तंत्र स्थापित करना है। आप पूरे पृष्ठ पर "माउसेंटर" और "माउसलेव" ट्रैक भी करेंगे (<body> या कुछ)। जब शॉर्ट-टर्म टाइमआउट समाप्त हो जाते हैं, तो वे विंडो स्थिति (अंदर या बाहर) की जांच कर सकते हैं और जब विंडो फोकस में नहीं है तो प्रक्रिया को पुनरारंभ नहीं कर सकता है। "माउसेंटर" हैंडलर सभी रोके हुए टाइमर शुरू करेगा।

संपादित करें — @ सिम विदास ने एक उत्कृष्ट उदाहरण पोस्ट किया है।

3

आप की तरह कुछ कर सकते हैं:

$([window, document]).blur(function(){ 
     // Clear timeout here 
}).focus(function(){ 
     // start timeout back up here 
}); 

विंडो IE के लिए है, दस्तावेज़ ब्राउज़र शेष विश्व के लिए है।

+0

इस उत्तर के लिए धन्यवाद। मैंने दूसरे का इस्तेमाल किया क्योंकि यह सभी reqs पूरा किया। लेकिन इस बारे में, मुझे सभी ब्राउज़रों के लिए ऑब्जेक्ट के रूप में '$ (विंडो)' के साथ और अधिक सफलता मिली। – Kyle

6

Šime Vidas द्वारा महान जवाब है, यह मुझे मेरे अपने कोडिंग के साथ मदद की। पूर्णता खातिर मैं एक उदाहरण बना आप setInterval के बजाय setTimeout का उपयोग करना चाहते हैं के लिए:

(function() { 

    function myFunction() { 
     if(window.blurred) { 
      setTimeout(myFunction, 100); 
      return; 
     } 

     // What you normally want to happen 

     setTimeout(myFunction, 10000); 
    }; 
    setTimeout(myFunction, 10000); 

    window.onblur = function() {window.blurred = true;}; 
    window.onfocus = function() {window.blurred = false;}; 

})(); 

आप विंडो को धुंधला कर जांच सामान्य से सेट में कम समय है कि देखेंगे, तो आप इस पर कैसे निर्भर करता है सेट कर सकते हैं खिड़की पर ध्यान केंद्रित होने पर जल्द ही आपको शेष फ़ंक्शन चलाने की आवश्यकता होती है।

0

मैं अपने स्लाइडर में Šime Vidas के रूप में लगभग एक ही दृष्टिकोण का उपयोग, लेकिन मेरे कोड पेज दृश्यता जांच के लिए document.visibilityState पर आधारित है:

var interval = 4000; 

function slideshow() { 
    // slideshow code 
}; 

$(document).ready(function() { 

var switchInterval; 

function intervalHandler() { 
    switchInterval = setInterval(function() { 
    if (document.visibilityState === "visible") { 
     slideshow(); 
    } else { 
     return; 
    } 
    }, interval); 
} 

intervalHandler(); 

}); 
संबंधित मुद्दे