25

I have a window I'm opening with a Javascript function:

function newwindow() 
{ 
window.open('link.html','','width=,height=,resizable=no'); 
}

I need it that once the new window opens that the focus returns to the original window. How can I do that? And where do I put the code - in the new window, or the old one? Thanks!

Flimzy
  • 68,325
  • 15
  • 126
  • 165
IsaacL
  • 592
  • 4
  • 12
  • 25
  • WELL, I have a test where I want to click one button but have 12 different windows (Post data response from server) to open to view the layouts and compare them quickly/easily, so far I can only get the last getelementbyId to bind onClick event, I think its because the window loses focus and cannot locate the other IDs on the result window – Frankenmint Dec 03 '14 at 03:54
  • 1
    @DanMcGrath - there are definitely legitimate uses for this. In my case, we have search results for "deals" that link to outside vendor webpages. One of these vendors (called Abenity), gives us a unique login url for every user, and this user must be logged into Abenity before being able to view any of their deals. Now, we can't do a AJAX get on this Abenity login url, and we want to keep the user on our page... So, our best option is to open the login window as a "pop-under", keep the user on our page, then redirect the user to the deal on the Abenity page (where they are now logged in). – jball037 Mar 04 '15 at 21:17
  • Sometimes good UX has to trump good programming :P – jball037 Mar 04 '15 at 21:20
  • @DanMcGrath I'm getting data from a web service (http://services.tropicos.org/), and want two things: 1) part of the data appears in the current window; 2) a page of the service site opens in the background. So, that's a reason for using this technique... – Rodrigo Feb 15 '16 at 14:15

4 Answers4

14

This is known as a 'pop-under' (and is generally frowned upon... but I digress).. It should give you plenty to google about

You probably want to do something like:

var popup = window.open(...);
popup.blur();
window.focus();

Which should set the focus back to the original window (untested - pinched from google). Some browsers might block this technique.

ChadT
  • 7,323
  • 2
  • 39
  • 56
  • 1
    I tried using the blur() thing, but it didn't work so well in Firefox, so I guess that should work better - I just wasn't sure how to refer back to the original window. I also saw something about window.opener.focus() = does anyone know how I would use that? – IsaacL Feb 02 '10 at 03:39
  • 3
    Popup blockers have progressed a bit. I'm not surprised that browsers will block this technique - it's almost always used for evil. – ChadT Apr 28 '14 at 06:44
  • Most of site telling about same trick to open new window in background, but none of them working. Des any other trick to do so from JavaScript/jQuery etc. – Sanjay Goswami Jan 15 '16 at 11:52
  • 1
    @DemvenWeir - it's likely now being blocked by browsers. – ChadT Feb 19 '20 at 22:05
6

After calling window.open, you may try to use

window.resizeTo(0,0); 
window.moveTo(0,window.screen.availHeight+10);

this way can not really open window in background, but works in similar way. Chrome works fine, did not try other browser.

Albert
  • 159
  • 2
  • 6
  • wow, genius. also,then you can use `window.close();` in that popup page too (if you own that page). – T.Todua Oct 30 '15 at 22:17
  • @tazo you can also use close() even if you don't own that page, you just need to save the window in a variable when you open it w = window.open(...); .... w.close(); – aljgom Sep 22 '16 at 00:27
6

If Albert's solution doesn't work for you and you actually want the window visible, but to be opened behind the current window, you can try opening a new tab in the opener window and closing it right away, this will bring the focus back to the opener window. 

window.open('link.html','','width=,height=,resizable=no');  
window.open().close();

However, I believe whether the second window opens in a tab or a new window depends on your browser settings.

Please don't use "pop-unders" for evil.

aljgom
  • 6,215
  • 1
  • 28
  • 23
2

You can use either "blur" or "focus" to do that required action.

"blur"

function newwindow()  
{  
    var myChild= window.open('link.html','','width=,height=,resizable=no');  
    myChild.blur();
}

"focus"

function newwindow()  
{  
    window.open('link.html','','width=,height=,resizable=no');  
    window.focus();
}

Put the code in your parentWindow (i.e. the window in which you are now)

Both will work.

Toto
  • 86,179
  • 61
  • 85
  • 118
Nazmul
  • 6,968
  • 12
  • 50
  • 63