JavaScript Redirect page

Many times you need to let the users go to a different page than the default one. This process is called redirection and is done by using JavaScript Redirect.  User writes a url in the browser address bar and  the application wants to open some other url.

For example let there be a website whose url is difficult to remember. The owners of the website decided to have a new and an easy to memorize url that also reflects the purpose of the business of the company. The new url cannot be propagated to all the users. Moreover owners do not want the users to stop using the older url. In such a situation JavaScript Redirect is used to redirect the older url to the new url.

Why you need to Redirect?

In addition to the discussed example there can be many situations where you need JavaScript Redirect in your website.

  • Renaming domain.
  • Restructuring the URL.
  • Redirect to different pages depending on demography, gender, location or device.
  • Sending to user to a different page after a form submission.  For example take the online shoppers to cart, payment page or thank you page.
  • When a user need to login to access web application sections.
  • Converting an HTTP website to HTTPS (Secure) website.

How to implement JavaScript Redirect?

The simplest method provided in JavaScript for redirection is location property of window object. Window object refers to the browser. location property represents the url which will open in a browser tab.

In the below example a button is created. When a user clicks this button she will be taken to a different page than the current location. In the Input Button type the onclick attribute is given the name of the user defined JavaScript function “redirect()”. In this function the window.location is assigned the url that has to be rendered in the tab. The url can be a different website or a page of the same website.

<HTML>
<TITLE> Welcome to CSVeda.com </TITLE>
<HEAD>
    <SCRIPT LANGUAGE="javascript">
    function redirect()
    {
        window.location = "https://csveda.com/";
    }
    </SCRIPT>
  </HEAD>
<BODY>
Click to move <Input type="Button" value="Redirect" onclick="redirect()"> 
</BODY>
</HTML>