Nicolas Bouliane

Javascript, jQuery and parent windows

Posted on

When you open a window with window.open, you can access the popup’s parent window using window.opener from the child window.

//In the parent window
window.open('http://example.com/url'); //Opens a new window/tab with this URL

//In the opened window
window.opener.document;

You can perform the same requests on window.opener.document as you would on the document object:

window.opener.document.getElementById('#tableInParent'); //Gets #tableInParent in the parent window

If you want to use jQuery selectors on element in the parent window, this is how you do it. In the example below, we fade out a table in the parent window:

$(window.opener.document).find('#tableInParent').fadeOut(); //Fades out #tableInParent

Alternatively, you can also set the selector’s scope:

$('#tableInParent', window.opener.document).fadeOut(); //Fades out #tableInParent

That’s it! If you want to learn jQuery properly, I highly recommend Mark Myers’ “A Smarter Way to Learn jQuery”. Mark Myers tends to write very high quality programming books with a focus on good practices.