How to refresh or reload a page automatically in jQuery

← PrevNext →

Last updated: 9th October 2025

Refreshing a web page can be essential for keeping content up-to-date, especially in dashboards, live feeds, or embedded frames. Whether you're looking to reload an active page manually with a button click or set up automatic refresh intervals, JavaScript's location.reload() method makes it simple. In this tutorial, you'll learn how to use jQuery to refresh a page both manually and automatically at a specified time interval. Let’s dive into practical examples that are easy to implement and perfect for modern web applications.

I have shared two different methods for "refreshing" (or reloading) a web page.

1) In the first method, I’ll use a "button" control and its click event to trigger page reload. This is a manual process.

2) In the second method, I’ll use a timer to trigger refreshing or reloading a page. This is an automatic process.

👉 By the way, you can reload a web page automatically using pure JavaScript.

See this demo

location.reload() method accepts a Boolean value "forceGet", which can be either true or false. Setting location.reload(true); ensures that the current page is fully loaded ignoring the "cache".

The jQuery $(document).ready(function() { }) ensures that the entire page is fully loaded before any event is handled.

1) Manually Refresh (or reload) a Page with Button Click

In the first method, the page will reload when a user clicks the button.

The Markup and the Script
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>

<body>
    <div><input id="btReload" type="button" value="Reload Page" /></div>
</body>

<script>
    $(document).ready(function() {
        $('#btReload').click(function () {    // Reload page on button click.
            location.reload(true); 
        });
    });
</script>
</html>

2) Automatically Refresh (or reload) a Page using SetInterval() Method

In the second example, I am using the setInterval() method to call the ".reload()" function.

<script>
    $(document).ready(function() {
        // Call refresh page function after 5000 milliseconds (or 5 seconds).
        setInterval(refreshPage(), 5000);
    });

    function refreshPage() { 
        location.reload(); 
    }
</script>
See this demo

The automatic page reload is initiated using the setInterval() method in JavaScript. This method accepts two parameters: the first is a function containing the logic to refresh the page, and the second is the time interval, in this case, 5000 milliseconds (or 5 seconds). This setup ensures the function is executed repeatedly at the specified interval, keeping your content fresh without manual intervention.

Note: Consider Modern Alternatives for Better Performance

If you're building a modern web application, it's worth exploring alternatives like AJAX or WebSockets for smoother, real-time updates without the need to reload the entire page. These technologies offer better user experience and performance, especially for dynamic content. However, for simpler use cases or quick implementations, the examples provided using location.reload() (in the post) still serve the purpose effectively.

← PreviousNext →