Hi there,

Im trying to design a fun page where a after an onclick on the parent page, several small child windows are opened. Upon clicking the content of any of those windows, I want all of the child windows to close. I can get self.close() to close the clicked window, but I cannot communicate with the other child windows, even if I reference them by their name, ie winName.close()... are there special rules for doing this?
Essentially, Im wondering if child windows can talk to each other, there must be a way for that to happen...?

A miniaturized version of what I am trying to do can be seen here:
http://stevenewberry.com/experimental/randombirds1.html
(click the red square!)

Thanks for any insight you may have...

You need to enter the reference to the newly created pages in an array which is kept in the main page and use that array to loop through the window references and close them.

Something like this:

[B] Main.html[/B]

<html>
<head>
    <script>
    var wnd = new Array();
     function openit(id)
    {
        if(!wnd[id] || wnd[id].closed)
            wnd[id] = window.open("Child.html");    
        else
            wnd[id].focus();
    }
    
    function closeEverything()
    {
        for(var i = 0; i < wnd.length; ++i)
            wnd[i].close();
    }
    </script>
</head>
<body>
    <form>
        <input type="button" value="Open1" onclick="openit(0);" /><br/>
        <input type="button" value="Open2" onclick="openit(1);" /><br/>
        <input type="button" value="Open3" onclick="openit(2);" /><br/>
    </form>
</body>
</html>

[B] Child.html[/B]

<html>
<head>
    <script>
    function closeAll()
    {
        window.opener.closeEverything();
    }
    </script>
</head>
<body>
    <form>
        <input type="button" value="Close Me" onclick="window.close();" /><br/><br /><br />
        <input type="button" value="Close all children" onclick="closeAll();" /><br/>
</form>
</body>
</html>
This article has been dead for over six months. Start a new discussion instead.