Q:

How to Redirect to Another Web Page Using jQuery or JavaScript

mhmadesk
Save to bookmark
|
2022-05-18
|
  349 
Very Easy
0

How to Redirect to Another Web Page Using jQuery or JavaScript

JQUERY,
login and add your own answer to this question

All Answers

mhmadesk
2022-05-18
need an explanation for this answer? contact us directly to get an explanation for this answer

Use the JavaScript window.location Property

You can simply use the JavaScript window.location property to make a page redirect, you don't need any jQuery for this. If you want to redirect the user from one page to another automatically, you can use the syntax window.location.replace("page_url").

The benefit here is, the replace() method does not save the originating page in the session history, meaning the user won't be able to use the browser back button to navigate to it, which prevents the user from getting redirected to the destination page once again.

Create a blank HTML file and put the following example code inside it. Now open this file in a web browser, you will be automatically redirected to the home page of this website after 10 seconds. If you notice carefully you will find that the browser back button is still disabled.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript Automatic Page Redirect</title>
<script>
    function pageRedirect() {
        window.location.replace("https://www.tutorialrepublic.com/");
    }      
    setTimeout("pageRedirect()", 10000);
</script>
</head>
<body>
    <p><strong>Note:</strong> You will be redirected to the tutorialrepublic.com in 10 sec. You are not able to get back to this page by clicking the browser back button.</p>
</body>
</html>

However, if you want to redirect the page when an event occurs, such as when the user click on a button element, you can just use the window.location.href = "page_url", which produce the similar effect when someone click a link to navigates to other page.

Similarly, create another HTML file and put the following example code inside it. Now open the file in a web browser and click the button on the page, it will redirect you to the home page of this site. Also, at this time you can see the browser back button becomes active.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>JavaScript Redirect a Page onClick Event</title>
<script>
    function pageRedirect() {
      window.location.href = "https://www.tutorialrepublic.com/";
    }      
</script> 
</head>
<body>
    <button type="button" onclick="pageRedirect()">Go to Tutorial Republic</button>
    <p><strong>Note:</strong> You can go to the tutorialrepublic.com by clicking the button above. You can get back to this page by clicking the browser back button.</p>
</body>
</html>

need an explanation for this answer? contact us directly to get an explanation for this answer

total answers (1)

JavaScript / jQuery Frequently Asked Questions
This question belongs to these collections

Similar questions

need a help?

find thousands of online teachers now
How to check if an element is hidden using jQuery... >>
<< How to call a function repeatedly after fixed time...