Tell me more ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

How can I redirect the user from one page to another using jQuery?

share|improve this question
14  
I keep seeing both window.location = url; and window.location.href = url; How are they different? Are they? BTW, I didn't know about window.location.replace(url). Nice. – David M. Miller Jun 7 '12 at 14:24
4  
window.location is the same as window.location.href, in terms of behavior. window.location returns an object. If .href is not set, window.location defaults to change the parameter .href. Conclude: Use either one is fine. – Shivan Raptor Aug 7 '12 at 7:03
27  
@Non-StopTimeTravel 1069 upvotes means that 1069 people googled for the best way to make a client-side redirect and found useful information here. Thanks to this question I discovered window.location.replace and it's advantage over window.location.href, and my 300000+ users will be happier when they hit the back button, so it yes, it deserves a big +1 – Samuel Rossille Jan 28 at 22:36
1  
What's asked here may be trivial to a lot of people, but it's very clear and it's a real question, that's undeniable. – Samuel Rossille Jan 28 at 22:39
2  
var url = "website name" $(location).attr('href',url); – Mad Scientist Feb 18 at 11:30
show 2 more comments

17 Answers

up vote 3249 down vote accepted

jQuery is not necessary, and window.location.replace(...) will best simulate an HTTP redirect.

It is better than using window.location.href =, because replace() does not put the originating page in the session history, meaning the user won't get stuck in a never-ending back-button fiasco. If you want to simulate someone clicking on a link, use location.href. If you want to simulate an HTTP redirect, use location.replace.

For example:

// similar behavior as an HTTP redirect
window.location.replace("http://stackoverflow.com");

// similar behavior as clicking on a link
window.location.href = "http://stackoverflow.com";
share|improve this answer
10  
The problem I've found using plain Javascript for redirection is that, fore example, IE 7 empties the REFERER var after having set window.location, and so in some php frameworks redirection to the previous page fails after a window.location change – Nicolò Martini Dec 5 '11 at 14:50
2  
in case of submit button add return false ; also inside your function – Abhi sr Apr 19 '12 at 11:52
2  
The question is about javascript specifically, but it may be worth noting that a meta refresh can be used as a fail back in case the user has javascript disabled – Hoppe Jan 24 at 0:51
5  
+1 for this "It is better than using window.location.href =, because replace() does not put the originating page in the session history, meaning the user won't get stuck in a never-ending back-button fiasco." – dougajmcdonald Jun 3 at 18:39
@NicolòMartini If(IE) document.write(""); – Jeff Noel Jun 7 at 13:28
show 5 more comments

WARNING: This answer has been provided as a possible solution, obviously, the pure JS approach is the right one.

Simply do :

var url = "http://stackoverflow.com";    
$(location).attr('href',url);
share|improve this answer
268  
Terrible why? A guy asks for jQuery, he gets one. – Radek Apr 28 '11 at 10:21
36  
whilst the OP should be open to suggestions, his question was pretty straight forward, and deserves an answer. also keep in mind people hitting this question in fututre may actually want to know how to do it in jquery, for whatever crazy reason. i dont see harm in explaining both – AaronHS Oct 27 '11 at 3:09
9  
More importantly, is there a way to do this with jQuery that is absracted? This is just a wrapper for window.location.href = url; But if jQuery had some function that, if window.location.href = url; wasn't going to work in the current environment (browser, OS, etc.) jQuery core could compensate? – Chris Feb 29 '12 at 16:03
23  
Forcing jQuery into the equation in this way is just ridiculous and pointless, especially since window.location is not an element and therefore does not have attributes. – Tim Down Oct 3 '12 at 10:32
8  
@CoffeeAddict, 2 year old comment, but please school me on how location.href = 'http://stackoverflow.com'; is more verbose than the alternative in the answer here? Even if you take away the variable it is still more verbose and more characters to use jQuery for this. – rlemon Mar 12 at 13:12
show 11 more comments

You don't need jQuery to do just that:

window.location = "http://www.page-2.com";
share|improve this answer
14  
note that you don't need jquery – Matt Briggs Feb 2 '09 at 12:57
96  
and this is why i tell people to learn javascript before learning a library. – geowa4 Feb 2 '09 at 14:22
19  
I somewhat agree with George, but actually since I've been learning jQuery it has actually helped me learn javascript, but it is important to know that jQuery is just that abstraction/tool that simplifies javascript for you. – Jon Erickson Feb 2 '09 at 18:49
222  
You mean to tell me there's an underlying technology to jQuery this whole time? Are you ****ing with me? – TheTXI Jun 26 '09 at 17:02
12  
@Lohoris ok, fair enough. I usually downvote wrong answers, upvote complete answeres, and ignore incomplete ones. But that's just me. – IonuČ› G. Stan Mar 30 '12 at 12:22
show 9 more comments

It would help if you were a little more descriptive in what you are trying to do. If you are trying to generate paged data, there are some options in how you do this. You can generate separate links for each page that you want to be able to get directly to.

<a href='/path-to-page?page=1' class='pager-link'>1</a>
<a href='/path-to-page?page=2' class='pager-link'>2</a>
<span class='pager-link current-page'>3</a>
...

Note that the current page in the example is handled differently in the code and with CSS.

If you want the paged data to be changed via AJAX, this is where jQuery would come in. What you would do is add a click handler to each of the anchor tags corresponding to a different page. This click handler would invoke some jQuery code that goes and fetches the next page via AJAX and updates the table with the new data. The example below assumes that you have a web service that returns the new page data.

$(document).ready( function() {
    $('a.pager-link').click( function() {
        var page = $(this).attr('href').split(/\?/)[1];
        $.ajax({
            type: 'POST',
            url: '/path-to-service',
            data: page,
            success: function(content) {
               $('#myTable').html(content);  // replace
            }
        });
        return false; // to stop link
    });
});
share|improve this answer

This works for every browser:

window.location.href = 'your_url';

Good luck!

share|improve this answer
var url = 'asdf.html';
window.location.href = url;
share|improve this answer

All of these answers are correct, but I'll post this for those who might of run into the same strange issue I did. I was having an issue with HTTP_REFERER and how it was getting lost when using simply location.href.

In IE8 and lower location.href (or any & all variations of this lose this variable), which for secure sites is important to maintain, because testing for it (urlpaste'ing/ session / etc) can be helpful in telling whether a request is legitamate. (Note :: there are also ways to work-around / spoof these referer's, as noted by droop's link in the comments)

My cross-browser fix is this simple function. Assuming you of course, are worried about losing HTTP_REFERER as I stated. (otherwise you can just use location.href etc etc

function _Redirect (url) {
    var ua = navigator.userAgent,
        verOffset;

    if (verOffset = ua.indexOf("MSIE") != -1) {
        var version = parseInt(ua.substr(verOffset + 4, 2), 10);

        // IE8 and lower
        if (version < 9) {
            var referLink = document.createElement('a');
            referLink.href = url;
            document.body.appendChild(referLink);
            referLink.click();
        }
    }

    // All other browsers
    else { window.location.href = url; }
}

Useage: _Redirect('anotherpage.aspx');

share|improve this answer
4  
Foot note: checking for referrer as a security measure is a lousy solution. duckduckgo.com/?q=referrer+spoofing – droope Jan 29 at 23:41
Your browser-detection, like most user-agent-sniffing, is broken. In this case, you are trying to detect "IE versions below 9.0", but instead you are detecting "IE versions other than 9.0", so IE 10 will get your workaround unnecessarily. – IMSoP Jul 14 at 0:21
Nice find! Fixed it to sniff out only for 8 and lower now. Thanks @IMSoP – mcpDESIGNS Jul 15 at 15:47
$jq(window).attr("location","http://google.fr");

This version works well with jQuery 1.6.2.

share|improve this answer

You can do that without jQuery as:

window.location = "http://yourdomain.com";

And if you want only jQuery then you can do it like :

$jq(window).attr("location","http://yourdomain.com");
share|improve this answer

I also think that location.replace(url) is the best way, but if you want to notify the search engines about you redirection (they don't analyze javascript to see the redirection) you should add the rel="canonical" meta tag to your website.

Adding a noscript section with a html refresh meta tag in it, is also a good solution. I suggest you to use this javascript redirection tool to create redirections. It also have an IE support to pass the http referrer.

A sample code without delay look like this:

<!--Pleace this snippet right after opening the head tag to make it work properly-->
<!--REDIRECTING STARTS-->
<link rel="canonical" href="https://yourdomain.com"/>
<noscript>
<meta http-equiv="refresh" content="0;URL=https://yourdomain.com">
</noscript>
<script type="text/javascript">
    var url = "https://yourdomain.com";

    // IE8 and lower fix
    if (navigator.userAgent.match(/MSIE\s(?!9.0)/))
    {
        var referLink = document.createElement("a");
        referLink.href = url;
        document.body.appendChild(referLink);
        referLink.click();
    }

    // All other browsers
    else { window.location.replace(url); }
</script>
<!--REDIRECTING ENDS-->
share|improve this answer

But if some one wants to redirect back to home page then he may use the following snippet.

window.location = window.location.host

It would be helpful if you have three different environments as development, staging, and production.

You can explore this window or window.location object by just putting these words in Chrome Console or Firebug's Console.

share|improve this answer
Great answer ! I use that window.location = window.location.href; – Cataclysm Jul 11 at 10:03

On your click function just add

window.location.href = "the url where you want to redirect";
$('#id').click(function(){
    window.location.href = "http://www.google.com";
});
share|improve this answer

first write properly you want to navigate within application for another link from your application for another link here is the code:

window.location.href = "http://www.google.com";

and if you want to navigate pages within your application then also i have code if you want.

share|improve this answer

write the below code after php or html or jquery if in the middle of php or html then use tag

location.href = "http://google.com"
share|improve this answer

In javascript and jquery are using following code to redirect the one page to another page.

window.location.href="http://google.com";
window.location.replace("page1.html");
share|improve this answer

JQuery is not needed you can do this: window.open("URL","_self","","") It is that easy!!

share|improve this answer

Use the following code:

$('#id').click(function(){
   window.location.href("https://www.google.co.in/");
});
share|improve this answer
it is a repeat of another answer. – Hemerson Varela Jun 11 at 19:50
That's static effect. For only element that has #id – Aldi Unanto Jul 2 at 7:28

protected by Community Mar 27 '12 at 17:03

This question is protected to prevent "thanks!", "me too!", or spam answers by new users. To answer it, you must have earned at least 10 reputation on this site.

Not the answer you're looking for? Browse other questions tagged or ask your own question.