HTML - Seite nach Inaktivität aktualisieren

Question

Ich habe einen Touchscreen mit einigen sehr einfachen HTML-Seiten. Aber wenn es keine Aktivität für vielleicht 5 Minuten gibt, sollte es die Hauptseite erneut laden.

So ist es nicht nur eine Auffrischung der Website, sondern eine Last der Haupt-Seite, wenn es keine Aktivität ist

---

nur eine Frage: Wo ist das Skript wissen, welche Seite die Hauptseite ist?. Wenn jemand zu "site B" geht, sollte er nach einigen Minuten ohne Bewegung zurück zu "site A" gehen.

Answer 1

Sie müssten JavaScript verwenden. Es gibt ein Das jQuery idletimer Plugin bei http://paulirish.com/2009/jquery-idletimer-plugin/

Beispiel:

// idleTimer() takes an optional argument that defines the idle timeout 
// timeout is in milliseconds; defaults to 30000 
$.idleTimer(10000); 


$(document).bind("idle.idleTimer", function(){ 
// function you want to fire when the user goes idle 
}); 


$(document).bind("active.idleTimer", function(){ 
// function you want to fire when the user becomes active again 
}); 

// pass the string 'destroy' to stop the timer 
$.idleTimer('destroy'); 

Referenz: How to change a page location after inactivity of 5 mins

Answer 2

Hier ist klar JavaScript-Implementierung, ohne Abhängigkeiten:

var inactivityTime = function() { 
      var timer; 

      window.onload = timerReset; 
      document.onkeypress = timerReset; 
      document.onmousemove = timerReset; 
      document.onmousedown = timerReset; 
      document.ontouchstart = timerReset; 
      document.onclick = timerReset; 
      document.onscroll = timerReset; 
      document.onkeypress = timerReset; 

      function timerElapsed() { 
       console.log("Timer elapsed"); 
       location.reload(); 
      }; 

      function timerReset() { 
       console.log("Reseting timer"); 
       clearTimeout(timer); 
       timer = setTimeout(timerElapsed, 5 * 60 * 1000); // 5 mins 
      } 
     }; 

Sie können passen Sie die Liste der Ereignisse an, um zu hören, um die beste Leistung zu erzielen.
Complete list of DOM events.

Answer 3

Angenommen, keine Aktivität bedeutet, dass Sie keine Klick-, Scroll- und Bewegungsereignisse erhalten. Sie müssen diese Ereignisse im body-Element Ihrer Seite abhören und einen Bereich festlegen, der die Seitenaktualisierungsmethode aufruft.

var timeOut = null; 
var activityMade = function(){ 

clearInterval(timeOut); //first clears the interval 
    timeOut = setInterval(function(){ console.log("Page Refreshed"); }, 3000); //logs to the console at every 3 seconds of inactivity 
} 

var bindEvents = function(){ 
    var body = document.getElementById("app"); 
    // bind click move and scroll event to body 
    body.addEventListener('click', activityMade); 
    body.addEventListener('mousemove', activityMade); 
    body.addEventListener('scroll', activityMade); 
    activityMade(); // assume activivity has done at page init 
} 

bindEvents(); 

Sie können so viele Ereignisse binden, wie Sie möchten, um sie an Ihre Bedürfnisse anzupassen. Hier

ist ein funktionierendes Beispiel https://jsfiddle.net/fspayfqt/ Sie bitte, dass für diese perfekt das Körperelement arbeiten, wird das gesamte Fenster des Navigators abdecken und dies kann mit CSS mit fester Position mit Höhe und Breite von 100%