How to Reload the Current Webpage w/ HTML & JavaScript?

How to Reload the Current Webpage w/ HTML & JavaScript?

You can use window.location.reload() JavaScript function to reload the current webpage on the fly. Although there are other ways to do this, it’s the best with the most cross-browser support.

You can put this JavaScript function in the onclick HTML attribute to reload the current webpage for an element click. Here’s an example to refresh the current webpage for a button click:

<input type="button" value="Reload" onclick="window.location.reload();"/>

You can use location.reload() instead of window.location.reload() JavaScript function, the window object is there to avoid conflicts as you might have the location as a local variable.

The function optionally accepts a parameter true or false to determine reload type. The true value is to reload from server and the false (which is default) is to reload from browser cache.

<input type="button" value="Reload" onclick="window.location.reload(true);"/>

The above code reloads a page directly from the server. But remember that you must add a return false function for a reload link element to work, otherwise, it’ll open the linked page.

<a href="" onclick="window.location.reload(); return false;">Reload</a>

For example, if you remove the return false from the above onclick attribute, then clicking the link will result in going to our homepage instead of reloading the page.

Alternative Methods to Reload a Webpage

Want to know about some alternatives? You can also use history.go(0) and window.location.href JavaScript functions to refresh the current webpage in the similar way.

<input type="button" value="Reload" onclick="history.go(0);"/>

<input type="button" value="Reload" onclick="window.location.href=window.location.href;"/>

There’re some limitations of these two functions. The history.go(0) function doesn’t work on Internet Explorer 6-9 and the location.href function reloads a page discarding the POST data (perform a GET request) while other functions reloads a page keeping the POST data.

So it’s better to use the window.location.reload() JavaScript function instead of all other functions to reload or refresh a webpage as they have some limitations.

1 Comment on this.

Leave a Reply

Your email address will not be published. Your comments must follow our guidelines.