CODEWITHSUNDEEP
javascript
user874329
user874329

Reputation: 191

How to return focus to the parent window using javascript?

This doesn't work as to return the focus to the parent window in Firefox 4 and 5

<html>
<head>
<script type="text/javascript">
  function openWin()
  {
     myWindow=window.open('','','width=200,height=100');
     myWindow.document.write("<p>The new window.</p>");
     myWindow.blur();
     window.focus();
  }
</script>
</head>
<body>

  <input type="button" value="Open window" onclick="openWin()" />

</body>
</html>

How can I return focus to the parent window using javascript?

Upvotes: 19

Views: 58813

Answers (6)

Elias
Elias

Reputation: 79

Here is how I solved this.

const ParentWindowName = 'ParentWindowName';

// here set the parent window name so that you can switch back to it later and open the new window/tab
export const openChildWindow = (id) => {
  window.name = ParentWindowName;
  window.ChildWindowName = window.open('/child', id);
};

// here you can change the focus back to the new window.
export const focusParentWindow = () => {
  window.open('', ParentWindowName).focus();
};

Upvotes: 2

Jason Foust
Jason Foust

Reputation: 11

I tried to use the above example and it didn't work for me. I had to use a recursive loop to find the opener until the window didn't have an opener (bad design, I know, but our app has several levels of child windows). Here is the code example. I hope it helps:

/* This is for the button functionality.  
The button element first comes in.  
This element is then used to get the document that has the element.  
The document window opener is then passed to the focusMain method */
function setFocusOnMain(el){
  var doc = el.ownerDocument;
  var win = doc.defaultView || doc.parentWindow;
  focusMain(win.opener.document);
}

/* This is a recursive method that checks for a parent window of the current document.  
If the document has no window opener, focus on this element because this is the Main.  
If the document has a window opener, pass the window opener's document to focusMain. */
function focusMain(doc) {
  var win = doc.defaultView || doc.parentWindow;
  if (win.opener == null) {
    doc.focus();
  } else {
    focusMain(win.opener.document);
  }
}

Upvotes: 1

Juan Posadas
Juan Posadas

Reputation: 219

You need to give your parent window a name.

Parent.html

<a id="link" href="#">Click to child.html </a>
<script type="text/javascript">
    $(document).ready(function () {
        window.name = "parent";
        $('#link').click(function (event){ 
            event.preventDefault();
            window.open("child.html");
        });
    });
</script>

Child.html

<a id="link" href="#">Return to Parent </a>
<script type="text/javascript">
    $(document).ready(function () {
        $('#link').click(function(event) {
            event.preventDefault();
            var goBack = window.open('', 'parent');
            goBack.focus();
        });
    });
</script>

Now, whenever you click the link in child.html, the parent window will be focused.

Upvotes: 21

Arthur van Dijk
Arthur van Dijk

Reputation: 121

Sorry for necromancing a very old question, but I ran into the same problem and couldn't find any solution. I eventually solved this by using the following script:

e = window;
while (e.frameElement !== null) {e = e.parent;}
e.parent.focus();

Apparently, calling just window.focus(); isn't enough. You have to call the Window's parent's focus method by using window.parent.focus(); You can't access any other properties from JS from it though, it will give a cross-source error. This script will also work if your script was fired from a frame within a page, assuming the frame and main page share the same source (domain).

Upvotes: 6

Brian
Brian

Reputation: 2778

If this is a Window you opened yourself you can use opener.focus();

Upvotes: -7

Adam Hopkinson
Adam Hopkinson

Reputation: 28795

I don't think you can return focus, not without closing the child window:

myWindow.close()

Upvotes: 2

Related Questions