Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

what happens to window events when changing documents?

Hey i have the following statechange event set on the window :

History.Adapter.bind(window,'statechange',function(e){ 
 console.log("statechange event occured ");
 //more code
    var newDoc = document.open();
    newDoc.write(file);
    newDoc.close();
});

i'm using history.js but that doesn't matter in this case as it binds the statechange regulary, i am getting the value of file like should be and works fine.

Now i have this code (and other code) inside an external js file, inside the file i'm iterating through all a tags and apply the following click event :

    $(element).on("click",function(e){
    e.preventDefault();
    //more code

    History.pushState({file : file},title, fullHref);


});

Now when i click the document is getting changed as expected but when trying to use back/forward buttons statechange event does not fire.

I should mention that this js is included in the files im loading as well.

So my initial thought was that as the document changes but the window doesn't, the event remains. which is not true as it applies the statechange event multipile times. So i tried applying the event once using cookie but that still does the same thing.

Now if instead of changing the document i simply apply it with jQuerys .html() the statechange event gets fired as exepected so i guess it's related to the document.

Why could this happen? I believe if i understood more about what happens to window events when changing documents i could solve this problem.

Tries :

  • I have now also tried binding to the popstate event via regular History API, still same results give or take. pushState doesn't fire popstate but back button does but without state.
  • I have come to the conclusion that i shouldn't be using history.js as i susspect the problem came from there so i "solved" my problems with popstate which still causing problems as document.open seems to be firing popstate. still looking for more information
  • I've tried using on, same result

Information :

  • the fact this example us using History is because of history.js, if i use regular history API still same problems.

I have read in mdn that :

{{ gecko_minversion_note("1.9.2", "Starting with Gecko 1.9.2, document.open() uses the

principal of the document whose URI it uses, instead of fetching the principal off the stack. As a result, you can no longer call document.write() into an untrusted document from chrome, even using wrappedJSObject.") }}

Which im not sure but i think could be realted to this problem

like image 490
eric.itzhak Avatar asked Nov 21 '12 12:11

eric.itzhak


People also ask

Which of the following events occurs before the browser unloads the document?

The beforeunload event is fired when the window, the document and its resources are about to be unloaded. The document is still visible and the event is still cancelable at this point. This event enables a web page to trigger a confirmation dialog asking the user if they really want to leave the page.

What is window event in JavaScript?

JavaScript Window Events are associated with the windows object defined for describing the events. There are other ways also which can handle the windows event like using and defining within the body tag for the events but that makes the entire code and the event a bit cumbersome to understand and evaluate.


1 Answers

Well, in the end i discovered that all though you only change document, window events gets deleted as they lay inside the document.

I encoutred my problems with History.js i think because the fact that im changing documents break it at some point.

What i did was use native HTML5 history API and rebinded the popstate event in the new document.

like image 67
eric.itzhak Avatar answered Nov 14 '22 00:11

eric.itzhak