Pass Variable to a Popup Window using Javascript

问题

I need to pass some text from the current page to a popup window without going for a server hit. The information (herewith represented by 90) is already available in the parent form (it's like a paragraph-long text which is stored in a hidden variable). I just need to display that as a popup.

Here's what I've tried, this works to some extent but doesn't work if I pass text, instead of a number. My second concern is that the solution kinda looks ugly. Any tips? Thank you.

This is SCCE, you can run it straight in your machine.

<html>
<head>
<title>A New Window</title>

<script type="text/javascript">
var newWindow;
var data;


function makeNewWindow(param) {
    data = param;

    if (!newWindow || newWindow.closed) {
        newWindow = window.open("","sub","status,height=200,width=300");
        setTimeout("writeToWindow()", 50); /* wait a bit to give time for the window to be created */
    } else if (newWindow.focus) {
        newWindow.focus( ); /* means window is already open*/
    }
}


function writeToWindow() {
    var k = data;
    alert(data);
    var newContent = "<html><head><title>Additional Info</title></head>";
    newContent += "<body><h1>Some Additional Info</h1>";
    newContent += "<scr"+"ipt type='text/javascript' language='javascript'> var localVar; localVar = "+ k +"; document.write('localVar value: '+localVar);</scr"+"ipt>";
    newContent += "</body></html>";
    // write HTML to new window document
    newWindow.document.write(newContent);
    newWindow.document.close( ); // close layout stream
}
</script>
</head>

<body>
<form>
<input type="button" value="Create New Window" onclick="makeNewWindow('90');" />
</form>
</body>
</html>

Actually, I googled and saw some other approach that uses window.opener.document.forms.element, but here, the window has to know in advance what it has to read from the parent. I need to be able to pass it as it will vary:

<textarea rows="15" name="projectcontent" id="projectcontent" cols="87"></textarea>
<a href="javascript:;" onclick="window.open('viewcon.asp', 'my_new_window','toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=yes, width=625, height=400');"><b>View Content</b></a>

 <head>
 <title>View Project Content</title>
 </head>
 <body>
 <img src="/images/toplogo.jpg"><br/>
<script language="Javascript">
document.write(window.opener.document.forms['yourformname'].elements['projectcontent'].value)
</script>
 <img src="/images/bottomlogo.jpg">
 </body>
 </html>

回答1:

use window.opener

From Mozilla Developer Network: When a window is opened from another window, it maintains a reference to that first window as window.opener. If the current window has no opener, this method returns NULL.

https://developer.mozilla.org/en-US/docs/Web/API/window.opener

This way you can have on your original window a callback, and you can notify the window it's load and ready, rather than wait a random delay...

you add a function on the original window:

   window.popupReady = function (callbackToPopup) {
      callbackToPopup(newData);
   }

then the popup can tell the parent window it's ready and pass it a callback to update it with data..

and on the popup try something like:

window.dataReady(newData)
{
   alert(newData);
}

document.addEventListener("load", function() { window.opener.popupReady (dataReady); }

I didn't test this code, but I would take such a path as this should ensure the popupWindow is ready for you and is along the spirit of JavaScript.

回答2:

In your onclick attribute you pass '90' to the function, but the function isn't set up to take an argument. So, change the first line of your function like this:

function writeToWindow(data) {

You don't need the global var data; or the local var k = data;, so get rid of them.

And instead of + k + write + data +.

That should do get your data passed.

回答3:

Use this code, it works perfectly in all browsers .

#desc = parent text area id
#desc_textarea = popup 

$("#desc_textarea").val(window.opener.$("#desc").val())

来源：https://stackoverflow.com/questions/16681773/pass-variable-to-a-popup-window-using-javascript

标签

javascript

window