4

I want my website page to reload once when it has already opened for the first time. I wrote this function in my javascript file for that...

var i;
$(document).ready(function(){
    for ( i=0;i<1;i++){
        if(i===0){
            location.reload();
            break;
        }  
    }
});

But the page keeps reloading again and again as if the above function was a recursive one.
How do I do this?

P.S I'm doing it because of this issue.

11
  • 1
    What is the reason for this requirement? Commented Dec 25, 2016 at 15:20
  • 1
    Your problem is that once the page is reloaded - the i variable goes back to 0 (and you will get into a loop). You can use cookie/localstorage to save the fact the the page was already loaded once (to prevent from loading it again). Why are you doing this?! Commented Dec 25, 2016 at 15:22
  • It's not recursive, just every time it loads again it fires a new ready Commented Dec 25, 2016 at 15:23
  • 2
    <script type='text/javascript'> (function() { if( window.localStorage ) { if( !localStorage.getItem('firstLoad') ) { localStorage['firstLoad'] = true; window.location.reload(); } else localStorage.removeItem('firstLoad'); } })(); </script> Commented Dec 25, 2016 at 15:23
  • dont use loop .. just reload the page when the page completely loads .. In ready event function or in load event function Commented Dec 25, 2016 at 15:25

7 Answers 7

3
<script type='text/javascript'>
  (function() {
    if( window.localStorage ) { 
      if( !localStorage.getItem('firstLoad') ) { 
        localStorage['firstLoad'] = true;
        window.location.reload(); 
      } else 
        localStorage.removeItem('firstLoad'); 
    } 
  })();
</script>
Sign up to request clarification or add additional context in comments.

1 Comment

Could you add a explanation? It makes sense to people who have been following the thread, but not so much to anyone who stumbles on this later.
1

Here is what's happening:

  • The page loads for the first time, jQuery calls any handlers on the document.ready event

  • The page reloads

  • The document.ready call is made again

  • repeat

Out of curiosity, why would you want to do that? And why do you have a for loop that will run for one iteration?


Also, to answer your question as far as I know the only way to make sure the page doesn't reload is use a cookie that lasts for about 5 seconds. Then, on document.ready check for that cookie and if it exists then don't reload.

Comments

1

You must either set a cookie (or use javascript's localStorage), or use xhr to retrieve a value held on a remote server.

If you want to use cookies, it's as simple as

document.cookie = "username=John Doe";

where the document.cookie is a query string of the form (x=y;a=b;n=z)

If you want the page to reload every time the user vists, be sure to unset the cookie once you've done any necessary processing when a page reload has been set.

6 Comments

A cookie is not the same as localStorage.
A cookie is not local storage?
Cookies are saved locally, but it is not the same as localStorage
I'll accept that localStorage is different from local storage, but local storage as a concept definately applies to cookies. I'll update the answer appropriately so there is no confusion.
Thanks, I commented because I thought there would be some confusion, especially for new users.
|
0
$( window ).load(function() {
    if (window.location.href.indexOf('reload')==-1) {
         window.location.replace(window.location.href+'?reload');
    }
});

1 Comment

Clever, but it would be better to set window.location.search instead of adding the string to the end of href.
0

Code is ok. But if the page is opened from another page with a link to an id (.../page.html#aa) the code only works with firefox. With other browsers reload the page without going to id. (Sorry for my english).

1 Comment

Consider explaining why this issue is present with the other answers and suggest a solution.
0

I found the solution with this code. It is assumed that the page is refreshed no earlier than one hour. Otherwise, add minutes to the oggindex variable.

<script>
var pagina = window.location.href; 
var d = new Date();
var oggiindex = d.getMonth().toString()+'-'+d.getDate().toString()+'-'+d.getHours().toString();
if (localStorage.ieriindex != oggiindex)
    {
    localStorage.setItem("ieriindex", oggiindex);
    window.location.replace(pagina);
    }
 </script>  

Comments

-1

Yours code executed each time $(document).ready(), so it's not surprise that your loop is infinity - each load finished as ready state.

If you give more detailed requirements we can solve it with no using window object as data holder. It's bad way but you can set it for test.

Window object stores variables not depend on reload because it's higher then document.

Let's try:

if( window.firstLoad == undefined  ){
    // yours code without any loop
    // plus:
    window.firstLoad = false;
}

You can make it with localStorage API.

Check this link also, it's giving more information about window object variables: Storing a variable in the JavaScript 'window' object is a proper way to use that object?

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.