Change URL and redirect using jQuery

Question

I have some code like this,

<form id="abc">
  <input type="text" id="txt" />
</form>

and now I want to redirect like this,

var temp = $("#txt").val();
url = "http://example.com/" + temp;
window.location.replace(url);
// or window.location(url);

Is there anyway in jQuery to solve this? It still lets me have url = http://example.com.

Thank alot all of you! Now I still do not know what difference between window.location and window.location.replace. In my example I've just need to post url to my page like that: http://abc.com/abc to get abc to search in my database with abc is what user typing in put and press enter or button but they always return http://abc.com?name=abc so I think I can trigger in submit event to redirect and change my url to what I want but they still do nothing. That's all, by the way thank you again! — gacon, May 12 '09 at 09:38
I explained the difference between window.location and window.location.replace here: http://stackoverflow.com/questions/846954/change-url-and-redirect-in-jquery/847130#847130 — Mathias Bynens, May 13 '09 at 08:26

score 348 · Answer 1 · edited Jun 24 '22 at 10:02

348

As mentioned in the other answers, you don't need jQuery to do this; you can just use the standard properties.

However, it seems you don't seem to know the difference between window.location.replace(url) and window.location = url.

window.location.replace(url) replaces the current location in the address bar by a new one. The page that was calling the function, won't be included in the browser history. Therefore, on the new location, clicking the back button in your browser would make you go back to the page you were viewing before you visited the document containing the redirecting JavaScript.
window.location = url redirects to the new location. On this new page, the back button in your browser would point to the original page containing the redirecting JavaScript.

Of course, both have their use cases, but it seems to me like in this case you should stick with the latter.

P.S.: You probably forgot two slashes after http: on line 2 of your JavaScript:

url = "http://abc.example/" + temp;

edited Jun 24 '22 at 10:02

Stephen Ostermiller

23,933
14
88
109

answered May 11 '09 at 07:53

Mathias Bynens

144,855
52
216
248

5

But to be very correct you should set window.location.href instead of window.location. While both work nowadays the latter is an object (and of course unsupported to assign a string to in an ancient IE version...) – Victor May 21 '13 at 21:50
1

@Victor That doesn’t list any ancient IE version where this breaks in. @bobince’s comment is correct: http://stackoverflow.com/a/10016109/96656#comment18225061_10016109 – Mathias Bynens May 23 '13 at 13:06
Minus 1. Not enough jQuery – Apr 04 '15 at 14:50

balexandre · Answer 2 · 2021-06-07T16:07:28.550

47

tell you the true, I still don't get what you need, but

window.location(url);

should be

window.location = url;

a search on window.location reference will tell you that.

edited Jun 07 '21 at 16:07

answered May 11 '09 at 06:34

balexandre

73,608
45
233
342

score 17 · Answer 3 · answered May 11 '09 at 06:35

17

jQuery does not have an option for this, nor should it have one. This is perfectly valid javascript and there is no reason for jQuery to provide wrapper functions for this.

jQuery is just a library on top of javascript, even if you use jQuery you can still use normal javascript.

Btw window.location is not a function but a property which you should set like this:

window.location = url;

answered May 11 '09 at 06:35

Pim Jager

31,965
17
72
98

down vote for claiming jQuery does not have a method for this (even though it is unnecessary overkill and should not be recommended) $jq(window).attr("location","http://yourdomain.com"); or $(location).attr('href',url); – rob Jun 05 '13 at 12:32
9

Upvoted to undo that downvote. Pim's response can easily read as "there is no specific method in jQuery for this." To downvote on lexical semantics is a misuse of that privilege. – Nov 26 '13 at 17:40
Upvoted because you know... it is right "there is no specific method in jQuery for this.", why would you like to have a such ugly solution as: $jq(window).attr("location","yourdomain.com"); when you can have something like window.location = url; – Rodolfo Abarca Oct 25 '18 at 16:48

score 14 · Answer 4 · edited Jun 24 '22 at 10:02

14

var temp="/yourapp/";
$(location).attr('href','http://abcd.example'+temp);

Try this... used as an alternative

edited Jun 24 '22 at 10:02

Stephen Ostermiller

23,933
14
88
109

answered Jan 12 '15 at 08:33

score 3 · Answer 5 · edited Aug 23 '12 at 04:21

3

Try this...

$("#abc").attr("action", "/yourapp/" + temp).submit();

What it means:

Find a form with id "abc", change it's attribute named "action" and then submit it...

This works for me... !!!

edited Aug 23 '12 at 04:21

Jack

10,943
13
50
65

answered Aug 23 '12 at 03:40

amouat

31
1

1

lol, that is some funny S! I like the idea though. Points for being creative! – Eric Bishard Nov 05 '14 at 03:40

score 0 · Answer 6 · answered Dec 19 '20 at 07:37

If you really want to do this with jQuery (why?) you should get the DOM window.location object to use its functions:

$(window.location)[0].replace("https://www.google.it");

Note that [0] says to jQuery to use directly the DOM object and not the $(window.location) jQuery object incapsulating the DOM object.

score -1 · Answer 7 · answered May 27 '21 at 14:25

-1

You can do it like:

var url = "http://example.com/" + temp;
$(location).attr('href',url);

answered May 27 '21 at 14:25

Akhilesh shukla

43
7

Kamil Kiełczewski · Answer 8 · 2019-04-14T13:22:20.023

-2

you can do it simpler without jquery

location = "https://example.com/" + txt.value

function send() {
  location = "https://example.com/" + txt.value;
}

<form id="abc">
  <input type="text" id="txt" />
</form>

<button onclick="send()">Send</button>

edited Apr 14 '19 at 13:22

answered Apr 14 '19 at 13:15

Kamil Kiełczewski

85,173
29
368
345

It doesn't work, and I can't see how it could. location is not a global. window.location is. edit: Yep verified. It doesnt work, at least not in chrome. Consider updating your example to window.location – Shayne Jul 16 '19 at 07:37
Strange - in my chrome, firefox, safari it works - the location is global property - e.g. when I type in chrome console: `location = 'https://google.com'` then it change page - do you try on other browsers? – Kamil Kiełczewski Jul 16 '19 at 07:51
@Shayne when you type `this` and `this.location` in console - what do you see? – Kamil Kiełczewski Jul 16 '19 at 07:55
this.location only works when "this" is referring to the window. Which is rarely going to be the case. Explicit is always better than Implicit, especially if you don't want to be surprised when your code isn't portable or reusable – Shayne Jul 17 '19 at 01:39
Yes you're right - however I wonder: why in your browser `this` not refer to `window` object (and above snippet dont works) ? (in browsers global context it should be set to windows [object](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/this#Simple_call)) – Kamil Kiełczewski Jul 17 '19 at 03:38

Change URL and redirect using jQuery

8 Answers8

Linked