Javascript,calling child window function from opener doesn't work

问题

I'm developing a web application that opens a popup using windows.open(..). I need to call a function on the opened window using the handle returned by "window.open", but I'm always getting the error message "addWindow.getMaskElements is not a function", as if it couldn't access the function declared on child window. This is the behavior in both IE and FF. My code looks like this:

function AddEmail(target,category)
{
    if(addWindow == null)
    {
        currentCategory = category;
        var left = getDialogPos(400,220)[0];
        var top =  getDialogPos(400,220)[1];
        addWindow = window.open("adicionar_email.htm",null,"height=220px, width=400px, status=no, resizable=no");
        addWindow.moveTo(left,top);
        addWindow.getMaskElements ();
    }
}

I've googled and read from different reliable sources and apparently this is supposed to work, however it doesn't. One more thing, the functions in child window are declared in a separate .js file that is included in the adicionar_email.htm file. Does this make a difference? It shouldn't.. So, if anyone has ran into a similar problem, or has any idea of what I'm doing wrong, please, reply to this message. Thanks in advance.

Kenia

回答1:

The window creation is not a blocking operation; the script continues to execute while that window is opening and loading the HTML & javascript and parsing it.

If you were to add a link on your original page like this:

<a href="#" onclick="addWindow.getMaskElements();">Test</a>

You'd see it works. (I tried it just to be sure.)

**EDIT **

Someone else posted a workaround by calling an onload in the target document, here's another approach:

function AddEmail()
{

        if(addWindow == null) {
        addWindow = window.open("test2.html",null,"height=220px, width=400px, status=no, resizable=no");
        }

        if(!addWindow.myRemoteFunction) {
            setTimeout(AddEmail,1000);
        } else { addWindow.myRemoteFunction(); }
}

This keeps trying to call addWindow.myRemoteFunction every 1 second til it manages to sucessfully call it.

回答2:

The problem is that window.open returns fairly quickly, the document that is requested and then any other items that that document may subsequently refer to will not yet have been loaded into the window.

Hence attempting to call this method so early will fail. You should attach a function to the opened window's load event and attempt to make you calls from that function.

回答3:

The problem with the below one is :

When the javascript is being executed in the parent window, the child window is not loading. Hence, the invoking function from parent window is in the infinite loop and it is leading to crashing the window.

The window creation is not a blocking operation; the script continues to execute while that window is opening and loading the HTML & javascript and parsing it.

If you were to add a link on your original page like this:
<a href="#" onclick="addWindow.getMaskElements();">Test</a>
You'd see it works. (I tried it just to be sure.)

**EDIT **

Someone else posted a workaround by calling an onload in the target document, here's another approach:
function AddEmail()
{

        if(addWindow == null) {
        addWindow = window.open("test2.html",null,"height=220px, width=400px, status=no, resizable=no");
        }

        if(!addWindow.myRemoteFunction) {
            setTimeout(AddEmail,1000);
        } else { addWindow.myRemoteFunction(); }
}
This keeps trying to call addWindow.myRemoteFunction every 1 second til it manages to sucessfully call it.

回答4:

You are calling the function immediately after opening the window; the page on the popup may not be loaded yet, so the function may not be defined at that point.

来源：https://stackoverflow.com/questions/2117887/javascript-calling-child-window-function-from-opener-doesnt-work

标签

javascript

function

popup

window.open