focus child window from another child window

Question

I have the following scenario like this :

I have a main window[main.html]. There are three links called Popup1, Popup2, Popup3. On clicking the link open Popup1 window, Popup2 window respectively.

<html>
<head>
  <title>Popup Focus Example</title>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8/jquery.min.js"></script>
  <script>
      var openWin = [];
      $(function(){
          $('#elem').on('click', 'a', function(){
              var index = $(this).index();
              var page = 'pop'+(index+1)+'.html';
              var w = window.open(page, $(this).attr('title'), '_blank');
              openWin[index] = w;

          });
      });
  </script>
</head>
<body>
  <div id="elem">
    <a href="javascript:void(0);" title="Pop 1">Pop 1</a>
    <a href="javascript:void(0);" title="Pop 2">Pop 2</a>
    <a href="javascript:void(0);" title="Pop 3">Pop 3</a>
  </div>

</body>
</html>

Now the windows open are window 1 & window 2. I want to transfer the focus of the window 1 from window 2. is there anyway this can be done?

pop1.html

<html>
<head>
  <title>Popup 1 Example</title>
  <script type="text/javascript">
    function go() {
        if(window.opener.openWin) {
            var popup2 = window.opener.openWin[1];
            popup2.focus();
        }
    }
  </script>
</head>
<body>
  <div>
    popup 1 example
  </div>
  <div><a href="javascript:void(0);" onclick="go();">Go to Popup2</a></div>
</body>
</html>

pop2.html

<html>
<head>
  <title>Popup 2 Example</title>
</head>
<body>
  <div>
    popup 2 example
  </div>
</body>
</html>

Check main.html code in fiddle http://jsfiddle.net/tmf8cry8/2/

May this link help you http://stackoverflow.com/questions/11407153/open-a-window-behind-the-current-window-using-javascript-jquery — Sadikhasan, Jan 19 '15 at 07:23

score 0 · Answer 1 · answered Jan 19 '15 at 07:26

0

You have written the code properly, please implement the two changes as listed below...

1) You need to push the window object in openWin Array

var openWin = [];
  $(function(){
      $('#elem').on('click', 'a', function(){
          var index = $(this).index();
          var page = 'pop'+(index+1)+'.html';
          var w = window.open(page, $(this).attr('title'), '_blank');
          //openWin[index] = w;
          openWin.push(w); //Push the window object

      });
  });

2) Access the window object using the array index to focus the window

function go() {
    //console.log(openWin);
    //if(window.opener.openWin) {
      //  var popup2 = window.opener.openWin[1];
        //popup2.focus();
    //}
    //Supposing that pop1, pop2 and pop3 are opened, you want to access pop2
    openWin[1].focus();

}

Hope it helps!

answered Jan 19 '15 at 07:26

Hemant

1,999
2
12
8

Please open all windows in a sequential order and then try it! I have tested it in firefox – Hemant Jan 19 '15 at 07:37
I have checked it on chrome too! – Hemant Jan 19 '15 at 07:39
I'm getting `openWin` is not defined on pop1.html page – som Jan 19 '15 at 07:45
Close all opened windows, refresh the page and let me know! – Hemant Jan 19 '15 at 08:00
How can you get the `openWin` variable in pop1.html page.It shows always undefined.`openWin` is defined in main.html page. – som Jan 19 '15 at 08:03
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/69104/discussion-between-hemant-and-som). – Hemant Jan 19 '15 at 08:08
Will let you know as soon as possible! – Hemant Jan 19 '15 at 11:22

score 0 · Answer 2 · answered Jan 19 '15 at 15:16

You can use the method window.open

window.open("",window_name).focus();

Assuming your window is opened, you can transfer focus to the window using the above code.

Please use the following code in pop2.html and try [after opening all windows in a sequential order].

<html>
<head>
<title>Popup 2 Example</title>
<script language="javascript">
function openNew()
{
    window.open("","Pop 3").focus();
}
</script>
</head>
<body>
<div>
popup 2 example
</div>
<a href="javascript:void(0);" onclick="javascript:openNew();">
 Go to pop3</a>
</body>
</html>

As per you code, you are using title attribute to naming windows, hence Pop 3 is used to transfer focus to Pop 3 window.

Alternatively, you may check if the window instance is opened or not and then load the URL entirely or transfer focus

Hope it helps!!!

miguel-svq · Answer 3 · 2015-01-28T02:07:28.313

Make go() function just call a function in the opener window, e.g.:

window.blur(); //focus out of here
window.opener.myParentWindowFunction( 2 );

That function (in the "parent" window) should call then a function in the target window that just "window.focus()".

funtion myParentWindowFunction( target ){
 window.blur();//focus out of here also
 openWin[target].callFocus();
}

And on every popup:

function callFocus(){ window.focus(); }

You can't make a window "send" the focus to another (security issues I guess), but you can make a window to "ask for it"... and depends on the browsers if it's going to get it (in chrome doesn't work, but if you add an alert() after the focus it will change the window. Funny, because if you just put the alert but not the focus it doesn't swap the windows...)

Code is just a mockup, but that's the concept. You have to use the opener window as relay comunicate to the desired window that it have to call the focus. Hope you don't need it really crossbrowser.

focus child window from another child window

3 Answers3