setting focus to a child window with JavaScript - javascript

I have the following script:
var a = window.open( "http://sitea.net" );
var b = window.open( "http://siteb.net" );
a.setFocus();
I would expect the focus to go to the first window (sitea.net), but instead the latest child opened is focused (siteb.net). How can I make the first window focus?

I tried the above code. The "window.open" causes both sites to open even without the a.setFocus.
Putting both of the variables within a function should stop the dual loading of the windows.
Here is an example:
http://jsfiddle.net/latoyale/GAKFL/28/
Also I noticed while using your original code that both windows will not open if .setFocus is declared above window.open. Maybe this problem also has something to do with the code positioning of setFocus...

Related

New tab in foreground only works when browser is minimized [duplicate]

If you open a window like:
window.open ("url","winName","location=0,width=300,height=214");
If winName is already open it just changes the URL in the window. This is ok but if that window is behind the current window most users won't realize this and think that it is just not opening.
Is there any way that if the window is already open, it brings it to the front?
Update: This hasn't worked since Chrome (21+). The workaround is to close/reopen.
The window.open() method returns an object that represents the new window. You just need to window.focus() it:
var w = window.open ("url","winName","location=0,width=300,height=214");
w.focus();
Or simply:
window.open("url","winName","location=0,width=300,height=214").focus();
The various answers suggesting using any form of .focus() are likely not going to work in all browsers.
This used to work back in the day but not any more, mainly due to browsers working to actively stop shady ad networks from pushing their popup ads to the foreground.
In Mozilla Firefox in particular (depending on your version) there is a configuration setting that is turned on by default that stops other windows (e.g. popups) from focusing themselves.
You can find this setting in the about:config page (tread carefully!)
dom.disable_window_flip: true
If I recall correctly this setting used to be called something like ~"allow_raise_or_lower_windows*
Other browsers may implement something similar, but quite simply if 1 of the major browsers blocks the use of .focus() by default then there's not much use in attempting to call it.
As a result, the only solution I've seen that works is to see if the window exists, and is not already closed... and if so close it, then load the window you want.
function closePopupIfOpen(popupName){
if(typeof(window[popupName]) != 'undefined' && !window[popupName].closed){
window[popupName].close();
}
}
when opening your popup if there's a chance it is already open (and burried behind other windows) then you can call this function before you attempt to open your popup.
closePopupIfOpen('fooWin');
var fooWin = window.open('someURL', 'foo', '...features...');
The drawback of course is that if there was anything "important" (e.g. a form partially filled in) in that window it will be lost.
Update: This hasn't worked since Chrome (21+). The workaround is to close/reopen.
Be careful, because when you open a new window, the opener window might still have some code to be executed, maybe some of this code gives it the focus. You would see how your new window opens in the front and suddenly goes to the back, so, it is a great idea in these cases, to set a timeout in order to give the focus to the new window a bit later on, when all the javascript in the opener window is executed, you can do it this way:
setTimeout(function(){window.focus();},1000);
Being 1000 the amount of miliseconds to wait, and window the name of the opened window.
You could also use this code in the opened window in the body onload for example.
I fixed this by adding
onclick="myWin = window.open('','winName','location=0,width=300,height=214'); myWin.focus()"
to the html element(button) and then change the URL via JS.
window.focus() applied to the window in question should do the trick.
You can use jQuery :
myPopup = window.open(url, "Title","menubar=no, status=no, scrollbars=no, menubar=no, width=800, height=800");
$(myPopup).focus();
Closing the window first, does the trick for me:
window.open('', 'mypopup').close();
setTimeout(function() {
window.open('', 'mypopup').focus();
}, 500);
I had the same problem, have spent a lot of time to find a solution, finally it works by this:
var singleWindow;
function openNewWindow(){
if(singleWindow){
singleWindow.close();
}
singleWindow = window.open ("url","winName","location=0,width=300,height=214");
}
This close the current window (if exist) and open a new window that will be placed on the top (default behavior)
Hope this help you !

What is the equivalent of window.opener without opening a new window?

A library I am using gets a reference to the main window by adding this script to a popup window:
var winMain=window.opener;
This script lets the popup window access global variables from the window that opened it. Example:
<select name=MonthSelector onChange="javascript:winMain.Cal.SwitchMth(this.selectedIndex);winMain.RenderCal();">
However this leaves me in an awkward position if I try to call some of these variables without opening a new window. (For instance, if I try to embed one of the calendars inside a div instead of a new window.)
onChange="javascript:Cal.SwitchMth(this.selectedIndex);"
and
var winMain=window;
onChange="javascript:winMain.Cal.SwitchMth(this.selectedIndex);"
Both don't seem to work. Is there some way to get the current window's handle as a variable? Or an I just doing something wrong?
This question appears similar to mine, but the answers don't work.
change it to
var winMain = window.opener || window;
It says is there is no window.opener, use window.
A window.open equivalent is below
var w = window.open('', '', 'width=400,height=400,resizeable,scrollbars');
w.document.write('Content goes here');
w.document.close();
Use it according to your need.

Javascript Bring window to front if already open in window.open?

If you open a window like:
window.open ("url","winName","location=0,width=300,height=214");
If winName is already open it just changes the URL in the window. This is ok but if that window is behind the current window most users won't realize this and think that it is just not opening.
Is there any way that if the window is already open, it brings it to the front?
Update: This hasn't worked since Chrome (21+). The workaround is to close/reopen.
The window.open() method returns an object that represents the new window. You just need to window.focus() it:
var w = window.open ("url","winName","location=0,width=300,height=214");
w.focus();
Or simply:
window.open("url","winName","location=0,width=300,height=214").focus();
The various answers suggesting using any form of .focus() are likely not going to work in all browsers.
This used to work back in the day but not any more, mainly due to browsers working to actively stop shady ad networks from pushing their popup ads to the foreground.
In Mozilla Firefox in particular (depending on your version) there is a configuration setting that is turned on by default that stops other windows (e.g. popups) from focusing themselves.
You can find this setting in the about:config page (tread carefully!)
dom.disable_window_flip: true
If I recall correctly this setting used to be called something like ~"allow_raise_or_lower_windows*
Other browsers may implement something similar, but quite simply if 1 of the major browsers blocks the use of .focus() by default then there's not much use in attempting to call it.
As a result, the only solution I've seen that works is to see if the window exists, and is not already closed... and if so close it, then load the window you want.
function closePopupIfOpen(popupName){
if(typeof(window[popupName]) != 'undefined' && !window[popupName].closed){
window[popupName].close();
}
}
when opening your popup if there's a chance it is already open (and burried behind other windows) then you can call this function before you attempt to open your popup.
closePopupIfOpen('fooWin');
var fooWin = window.open('someURL', 'foo', '...features...');
The drawback of course is that if there was anything "important" (e.g. a form partially filled in) in that window it will be lost.
Update: This hasn't worked since Chrome (21+). The workaround is to close/reopen.
Be careful, because when you open a new window, the opener window might still have some code to be executed, maybe some of this code gives it the focus. You would see how your new window opens in the front and suddenly goes to the back, so, it is a great idea in these cases, to set a timeout in order to give the focus to the new window a bit later on, when all the javascript in the opener window is executed, you can do it this way:
setTimeout(function(){window.focus();},1000);
Being 1000 the amount of miliseconds to wait, and window the name of the opened window.
You could also use this code in the opened window in the body onload for example.
I fixed this by adding
onclick="myWin = window.open('','winName','location=0,width=300,height=214'); myWin.focus()"
to the html element(button) and then change the URL via JS.
window.focus() applied to the window in question should do the trick.
You can use jQuery :
myPopup = window.open(url, "Title","menubar=no, status=no, scrollbars=no, menubar=no, width=800, height=800");
$(myPopup).focus();
Closing the window first, does the trick for me:
window.open('', 'mypopup').close();
setTimeout(function() {
window.open('', 'mypopup').focus();
}, 500);
I had the same problem, have spent a lot of time to find a solution, finally it works by this:
var singleWindow;
function openNewWindow(){
if(singleWindow){
singleWindow.close();
}
singleWindow = window.open ("url","winName","location=0,width=300,height=214");
}
This close the current window (if exist) and open a new window that will be placed on the top (default behavior)
Hope this help you !

I need to open a new window in the background with JavaScript, and make sure the original is still focused

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!
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.
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.
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.
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.
tl;dr - in 2022 - ctrl/cmd clicking on a button and window.open(url, "_blank") in a javascript button handler's for loop will open multiple tabs in the background in Chrome.
I'm looking for this as of 2022 and none of the answers here worked (here and everywhere else I looked). My use case is clicking a button in a (progressive) web app which opens deep links to items in a list in background tabs (i.e. not "for evil").
It never occurred to me that ctrl/cmd + clicking on the button would open tabs in the background, but it does just as if the user clicked on an anchor tag itself directly - but only in Chrome. Combined with Chrome's relatively recent tab grouping feature, this can be very useful inside PWAs.
const isMozilla =
window?.navigator?.userAgent?.toString().toLowerCase().includes('firefox') ?? false;
for (let index = 0; index < urls.length; index++) {
const url = isMozilla ? urls.reverse()[index] : urls[index];
window.open(url, "_blank");
}
Note: I reverse() the array on Mozilla to get the order of newly created tabs as the user would expect them.
You can just use '_self'. It will be stay to the same page an
window.open(url, '_self');

Changing the address of the opener window in IE8

From a child popup window (opened using window.open), I am trying to change the URL of the window that opened me, e.g.
window.opener.location.href = 'http://www.google.com';
In all browsers this works wonderfully, except for IE8 (and I am somewhat sure it worked in previous IE8. Maybe a security update kills this).
In IE8 what happens is that the line above is treated as a request to open a NEW window with the address and the original opener window stays the same. And, since I am not putting this line inside an onclick event, this is treated as a popup.
So how do I do this in IE8? How do I change the opener location?
It looks like this is just not possible. I got no answer from anybody and all my research indicated that this is just another way MS added to block popups.
try to move action into parent window, like this:
//parent.htm
function changeUrl(url) {
location.href = url;
window.reload();
}
window.open("child.htm");
.....
//child.htm
window.opener.changeUrl(url);
try this:
on the opener window define a function called goto ;-)
function goto(url){ window.location.href = url; }
now from the child window call window.opener.goto(url);

Categories