jQuery continues even if user has left the page

Question

I want to make a page that runs a jQuery script when user gets in the page and the query runs even if user leaves the page or closes the browser. Is this possible?

if(localStorage.getItem("counter")){
  if((localStorage.getItem("counter") >= 300) || (localStorage.getItem("counter") <= 0)){
    var value = 300;
  }else{
    var value = localStorage.getItem("counter");
  }
}else{
  var value = 300;
}
document.getElementById('divCounter').innerHTML = value;

var counter = function (){
  if(value <= 0){
    localStorage.setItem("counter", 0);
    value = 0;
    $( ".exit" ).trigger( "click" );
  }else{
    value = parseInt(value)-1;
    localStorage.setItem("counter", value);
  }
  document.getElementById('divCounter').innerHTML = value;
};

var interval = setInterval(function (){counter();}, 1000);

This is my script. For more detail, this is a countdown from 300 that when user gets in the page it starts and I want to make it like it runs even if user has left the page till it gets 0.

Since Jquery runs in the browser you need a backend language. — Mihai, Jan 24 '17 at 19:14
No, it's not possible to execute code on a page that isn't loaded. There are some things you *can* do, such as perform your logic in a server-side language or perhaps store the state of the page in local storage and check for it the next time the user loads the page, etc. But you can't just arbitrarily execute code outside the context of the page in the browser. — David, Jan 24 '17 at 19:14
Closing the browser, or just the page, will make any JS code stop running. JS is client side. I think the only exception would be for AJAX calls that fired some request to a service and therefore, the service receiving the request will keep running until it's finished. But then, it won't be client side anyway. — emerson.marini, Jan 24 '17 at 19:15
Best way to make that even be simulated (and it would only apply if the user revisits the page before the time has elapsed), would be the use of localStorage -- if you save the start time of the timer in localStorage (or a cookie), then either when the timer has hit zero or when the page has reloaded, compare the start time with the elapsed time. It would take some thinking, but it may simulate what you want. — Snowmonkey, Jan 24 '17 at 19:18
You can execute script before the user leaves the page. http://stackoverflow.com/questions/28627111/how-to-call-a-function-before-leaving-page-with-javascript. But there's no way to execute a script after you has left the page. — Anthony C, Jan 24 '17 at 19:18

Blauharley · Accepted Answer · 2017-01-24T20:37:30.693

I dare to answer your question and nevertheless hope this will help you. There is no chance to run this js-code after this tab has been closed but you can remember the time an user left your site by setting a time_leave that is set on each interval-round and when an user leaves your site using onbeforeunload:

var value;
if (localStorage.getItem('counter')) {
  if ((localStorage.getItem('counter') >= 300) || (localStorage.getItem('counter') <= 0)) {
    value = 300;
  } else {
    value = getElaspedTime();
  }
} else {
  value = 300;
}

document.getElementById('divCounter').innerHTML = value;

var counter = function () {
  if (value <= 0) {
    localStorage.setItem('counter', 0);
    value = 0;
    //$('.exit').trigger('click');
  } else {
    value = parseInt(value) - 1;
    localStorage.setItem('counter', value);
  }
  document.getElementById('divCounter').innerHTML = value;
  // set "departure"-time
  localStorage.setItem('time_leave', (new Date()).getTime());
};

function getElaspedTime() {
  var now = new Date();
  var timeLeft = + localStorage.getItem('time_leave');
  timeLeft = new Date(timeLeft);
  var passedSecs = (now.getTime() - timeLeft.getTime()) / 1000;
  return parseInt(localStorage.getItem('counter')) - parseInt(passedSecs);
}

window.onbeforeunload = function(){
  // set "departure"-time when user closes the tap
  localStorage.setItem('time_leave', (new Date()).getTime());
};

var interval = setInterval(function () {
  counter();
}, 1000);

thanks. this solved the problem. but is there a way not to run window.onbeforeunload when page is refreshed. just run it when page is closed. — reza, Jan 24 '17 at 19:31
You are welcome! Sorry I just found onbeforeunload and unload. — Blauharley, Jan 24 '17 at 19:36
And thank you anyway because it was not even finished (the day was too long it seems). My answer was updated. — Blauharley, Jan 24 '17 at 19:58

jQuery continues even if user has left the page

1 Answers1