26

Essentially what I'd like to do is something to the effect of this:

window.location.href = "some_location";
window.onload = function() {
  alert("I'm the new location and I'm loaded!");
};

Is there any way to have a callback when the window's new location is loaded? (The above code doesn't work.)

Lukas
  • 9,765
  • 2
  • 37
  • 45
  • 1
    changing `location.href` causes the current page to close and a new page to open so any event on the old page can't be triggered when a new page is loaded – qwertymk Dec 11 '12 at 00:20

3 Answers3

19

No, you cannot do it the way you want. Loading a new page closes the current document and starts loading a new document. Any code in your current document will no longer be active when the new page starts to load.

To have an event handler when the new document loads, you would either need to insert code into the new page's document or load the new document into an iframe and monitor the loading of the iframe from your current document.

jfriend00
  • 683,504
  • 96
  • 985
  • 979
  • 2
    What if the window is a new window: var w = window.open(""); w.location.href = "some_location"; w.onload = function() {alert("Hi!");}; Assume that there is an actual reason I need to use a redirect instead of just opening directly to the URL, like I need to redirect on the response of a request or something. Is there any way then? – Lukas Dec 11 '12 at 00:27
  • 2
    @Lukas - if you are opening a new window (same with frames), there are security restrictions if the windows are on different domains and you cannot set event handlers in that window. If your windows are on the same domain, you should be able to set an onload handler for it. – jfriend00 Dec 11 '12 at 00:38
  • Hmmm... Check out http://jsfiddle.net/42hKC/ - I'm opening a new window within the same domain, attaching an onload to the new window and it's not ever firing. – Lukas Dec 11 '12 at 15:22
  • Just kidding... The updated fiddle works, by changing window.open("http://jsfiddle.net/") to window.open("/"): See http://jsfiddle.net/42hKC/4/ – Lukas Dec 11 '12 at 15:25
  • @Lukas - that's because you aren't actually opening a new window on the same domain. You script is running in a frame in a different domain `fiddle.jshell.net` (presumably done to protect the jsFiddle domain from jsFiddle scripts). – jfriend00 Dec 11 '12 at 15:27
  • OK, back to the original question: If I change it to var w = window.open(""); w.location.href = "/"; then is there any way to attach an onload to when the new location is loaded? See http://jsfiddle.net/42hKC/5/ – Lukas Dec 11 '12 at 16:08
  • That `w = window.open("/my-domain-path")` followed by `w.onload = ...` helps me, but does anyone know what browser support will be like? – RTF Oct 13 '14 at 11:28
  • 1
    @RTF - All browsers in use today support `window.onload`. – jfriend00 Oct 13 '14 at 16:54
4

Setting window.location.href to a new value tells the browser to simply go to the next page.

Like so:

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

Once the browser goes to google.com, that's it, your Javascript is no longer executing, and there is no way for you to have any sort of callback, because the browser is no longer running your page.

So, the answer is no.

mattgmg1990
  • 5,576
  • 4
  • 21
  • 26
0

in regards to callback and js execution in new context - no (as per orig answer), but there are ways to access loaded elements without callback. For e.g. scrollIntoView on a loaded element, you can append the selector:

const href = '#someElem'
if(window.location.pathname  !== '/') window.location.href = `/${href}`
else document.querySelector(href).scrollIntoView()
tomyhomie
  • 344
  • 2
  • 6