JAVASCRIPT JQUERY

[Solved -10 Answers]How to redirect to another webpage in JavaScript/jQuery

How to redirect the user from one page to another using javascript or jQuery?

  • jQuery is not necessary, and window.location.replace(…) will best simulate an HTTP redirect.
  • window.location.replace(…) is better than using window.location.href, because replace() does not keep the originating page in the session history.

Note:

  • To simulate someone clicking on a link, use location.href
  • To simulate an HTTP redirect, use location.replace
javascript code
// similar behavior as an HTTP redirect
window.location.replace("http://wikitechy.com");

// similar behavior as clicking on a link
window.location.href = "http://wikitechy.com";

jQuery:

javascript code
$(location).attr('href', 'http://wikitechy.com')

Below we are going to implement an alternative for IE8 & lower so that we don’t lose HTTP_REFERER. Otherwise you can almost always simply use window.location.href.

Use: redirect(‘anotherpage.aspx’);

javascript code
function redirect (url) 
{
    var ua        = navigator.userAgent.toLowerCase(),
        isIE      = ua.indexOf('msie') !== -1,
        version   = parseInt(ua.substr(4, 2), 10);

    // Internet Explorer 8 and lower
    if (isIE && version < 9) 
{
        var link = document.createElement('a');
        link.href = url;
        document.body.appendChild(link);
        link.click();
}

    // All other browsers can use the standard window.location.href (they don't lose HTTP_REFERER like Internet Explorer 8 & lower does)
    else 
{ 
        window.location.href = url; 
    }
}

  • You can use this Code:
javascript code
// window.location
window.location.replace('http://www.example.com')
window.location.assign('http://www.example.com')
window.location.href = 'http://www.example.com'
document.location.href = '/path'

// window.history
window.history.back()
window.history.go(-1)

// window.navigate; ONLY for old versions of Internet Explorer
window.navigate('top.jsp')

// Probably no bueno
self.location = 'http://www.example.com';
top.location = 'http://www.example.com';

// jQuery
$(location).attr('href','http://www.example.com')
$(window).attr('location','http://www.example.com')
$(location).prop('href', 'http://www.example.com')

  • To works for each browser:
javascript code
window.location.href = 'your_url';

  • Redirect to another page, you can use:
javascript code
window.location = "http://www.yoururl.com";

  • You can’t redirect to a function. What you can do is pass some flag on the URL when redirecting, then check that flag in the server side code and if raised, execute the function.
javascript code
document.location = "MyPage.php?action=DoThis";

  • HTML Example for Redirecting a Page or URL
  • Here is complete HTML page, which uses method to redirect a page or URL. Since you can only use one method at a time.
html code
<!DOCTYPE html>
<html>
        <head>
                <title>JavaScript and JQuery Example to Redirect a page or URL </title>
        </head>
        <body>
                <div id="redirect">
                        <h2>Redirecting to another Page</h2>
                </div>

                <script src="scripts/jquery-1.6.2.min.js"></script>
                <script>

                   // JavaScript code to redirect a URL
                      window.location.replace("http://www.wikitechy.com");
                      
                     // Another way to redirect page using JavaScript
                      //window.location.href="http://www.wikitechy.com";
              

                      //JQuery code to redirect a page or URL
                       $(document).ready(function(){
                         /var url = "http://www.wikitechy.com";
                         //$(location).attr('href',url);
                        });
                </script>
        </body>
</html>

  • This works with jQuery:
javascript code
$(window).attr("location", "http://google.fr");

  • HTML Page Redirect Using jQuery/JavaScript
javascript code
function YourJavaScriptFunction()
{
    var i = $('#login').val();
    if (i == 'login')
        window.location = "login.php";
    else
        window.location = "Logout.php";
}

If you need to give a complete URL as window.location=”www.wikitechy.com”;

READ  JAVASCRIPT - What is the difference between Bower and npm

About the author

Wikitechy Editor

Wikitechy Editor

Wikitechy Founder, Author, International Speaker, and Job Consultant. My role as the CEO of Wikitechy, I help businesses build their next generation digital platforms and help with their product innovation and growth strategy. I'm a frequent speaker at tech conferences and events.

X