How to reload page after specific seconds in jQuery ? - GeeksforGeeks

03 Aug, 2021
A page can be reloaded after a specific number of seconds in jQuery using two approaches.
Using location.reload() Method
Using history.go(0) Method
Using location.reload() Method: This method is used to reload the current page imitating the action of the refresh button of the browser. It has an optional Boolean parameter which can be used to denote that the page is reloaded from the server instead of being loaded from the browser cache.
The refresh code can be executed after a certain period of time using the setTimeout() function. This function has a delay parameter which denotes the time after which the function will execute. This value is given in milliseconds. The amount of time in seconds to be delayed in multiplied by 1000 to convert it to milliseconds.
The setTimeout code can be called after the document has finished loading by selecting the document object and using the ready() method on it. This will cause the page to reload after the specified amount of seconds.
Syntax:$(document).ready(function () {
      setTimeout(function () {
        alert('Reloading Page');
        location.reload(true);
      }, 5000);
    });
$(document).ready(function () {
      setTimeout(function () {
        alert('Reloading Page');
        location.reload(true);
      }, 5000);
    });
Example:<!DOCTYPE html><html><head>  <title>    How to reload page after    specific seconds?  </title></head><body>  <h1 style="color: green">    GeeksforGeeks  </h1>  <b>    How to reload page after    specific seconds?  </b>  <p>    GeeksforGeeks is a computer science    portal with a huge variety of well    written and explained computer science    and programming articles, quizzes and    interview questions.  </p>  <p>    The page will be reloaded in 5 seconds.  </p>  <script src="https://code.jquery.com/jquery-3.3.1.min.js">  </script>     <script type="text/javascript">    $(document).ready(function () {      setTimeout(function () {        alert('Reloading Page');        location.reload(true);      }, 5000);    });  </script></body></html>
<!DOCTYPE html><html><head>  <title>    How to reload page after    specific seconds?  </title></head><body>  <h1 style="color: green">    GeeksforGeeks  </h1>  <b>    How to reload page after    specific seconds?  </b>  <p>    GeeksforGeeks is a computer science    portal with a huge variety of well    written and explained computer science    and programming articles, quizzes and    interview questions.  </p>  <p>    The page will be reloaded in 5 seconds.  </p>  <script src="https://code.jquery.com/jquery-3.3.1.min.js">  </script>     <script type="text/javascript">    $(document).ready(function () {      setTimeout(function () {        alert('Reloading Page');        location.reload(true);      }, 5000);    });  </script></body></html>
Output:After loading the page:After 5 seconds:
After 5 seconds:
Using history.go(0) Method: This method loads a URL from the browser’s history depending on the parameter passed to it. If the parameter passed is ‘0’, it reloads the current page.
The refresh code can be executed after a certain period of time using the setTimeout() function. This function has a delay parameter which denotes the time after which the function will execute. This value is given in milliseconds. The amount of time in seconds to be delayed in multiplied by 1000 to convert it to milliseconds.
This code can be called after the document has finished loading by selecting the document object and using the ready() method on it. This will cause the page to reload after the specified amount of seconds.
Syntax:$(document).ready(function () {
      setTimeout(function () {
        alert('Reloading Page');
        history.go(0);
      }, 5000);
    });
$(document).ready(function () {
      setTimeout(function () {
        alert('Reloading Page');
        history.go(0);
      }, 5000);
    });
Example:<!DOCTYPE html><html><head>    <title>    How to reload page after    specific seconds?  </title></head><body>  <h1 style="color: green">    GeeksforGeeks  </h1>  <b>    How to reload page after    specific seconds?  </b>  <p>    GeeksforGeeks is a computer science    portal with a huge variety of well    written and explained computer science    and programming articles, quizzes and    interview questions.  </p>  <p>    The page will be reloaded in 5 seconds.  </p>  <script src="https://code.jquery.com/jquery-3.3.1.min.js">  </script>    <script type="text/javascript">    $(document).ready(function () {      setTimeout(function () {        alert('Reloading Page');        history.go(0);      }, 5000);    });  </script></body></html>Output:
<!DOCTYPE html><html><head>    <title>    How to reload page after    specific seconds?  </title></head><body>  <h1 style="color: green">    GeeksforGeeks  </h1>  <b>    How to reload page after    specific seconds?  </b>  <p>    GeeksforGeeks is a computer science    portal with a huge variety of well    written and explained computer science    and programming articles, quizzes and    interview questions.  </p>  <p>    The page will be reloaded in 5 seconds.  </p>  <script src="https://code.jquery.com/jquery-3.3.1.min.js">  </script>    <script type="text/javascript">    $(document).ready(function () {      setTimeout(function () {        alert('Reloading Page');        history.go(0);      }, 5000);    });  </script></body></html>
Output:
After loading the page:After 5 seconds:
jQuery is an open source JavaScript library that simplifies the interactions between an HTML/CSS document, It is widely famous with it’s philosophy of “Write less, do more”.You can learn jQuery from the ground up by following this jQuery Tutorial and jQuery Examples.
jQuery-Misc
Picked
JQuery
Web Technologies
Web technologies Questions
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Scroll to the top of the page using JavaScript/jQuery
How to get the ID of the clicked button using JavaScript / jQuery ?
jQuery | children() with Examples
How to redirect to a particular section of a page using HTML or jQuery?
How to prevent Body from scrolling when a modal is opened using jQuery ?
Top 10 Front End Developer Skills That You Need in 2022
Installation of Node.js on Linux
Top 10 Projects For Beginners To Practice HTML and CSS Skills
How to fetch data from an API in ReactJS ?
How to insert spaces/tabs in text using HTML/CSS?