使用 Javascript 将变量传递给弹出窗口
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16681773/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Pass Variable to a Popup Window using Javascript
提问by Question Everything
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.
我需要将当前页面中的一些文本传递到弹出窗口，而不会导致服务器命中。信息（这里用 90 表示）已经在父表单中可用（它就像存储在隐藏变量中的一段长文本）。我只需要将其显示为弹出窗口。
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.
这是 SCCE，你可以直接在你的机器上运行它。
<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:
实际上，我在谷歌上搜索并看到了其他一些使用 的方法window.opener.document.forms.element，但在这里，窗口必须事先知道它必须从父级读取什么。我需要能够通过它，因为它会有所不同：
<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>
回答by Dory Zidon
use window.opener
使用 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.
来自 Mozilla 开发者网络：当从另一个窗口打开一个窗口时，它会将第一个窗口的引用作为 window.opener。如果当前窗口没有开启器，则此方法返回 NULL。
https://developer.mozilla.org/en-US/docs/Web/API/window.opener
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.
我没有测试这段代码，但我会采取这样的方式，因为这应该确保 popupWindow 为您准备好并且符合 JavaScript 的精神。
回答by Derek Henderson
In your onclickattribute 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:
在您的onclick属性中，您将 '90' 传递给函数，但该函数未设置为接受参数。因此，像这样更改函数的第一行：
function writeToWindow(data) {
You don't need the global var data;or the local var k = data;, so get rid of them.
你不需要 globalvar data;或 local var k = data;，所以摆脱它们。
And instead of + k +write + data +.
而不是+ k +写+ data +。
That should do get your data passed.
那应该可以让您的数据通过。
回答by Ketan Barad
Use this code, it works perfectly in all browsers .
使用此代码，它在所有浏览器中都能完美运行。
#desc = parent text area id
#desc_textarea = popup
$("#desc_textarea").val(window.opener.$("#desc").val())
