Javascript 弹出窗口中的动态 iframe
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10474313/
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
Dynamic iframe in a Pop up Window
提问by Chris
I am trying to achieve 2 things with the href links below. First, I would like to fire-up a pop up window. Done. Next, I would like that pop up window to display an iframe. This was easily accomplished as well untilI realized I needed to pass the href link text as a parameter in my iframe src.
我正在尝试使用下面的 href 链接实现两件事。首先，我想启动一个弹出窗口。完毕。接下来，我希望弹出窗口显示 iframe。这也很容易实现，直到我意识到我需要在 iframe src 中将 href 链接文本作为参数传递。
So for example, the iframe wont load in my pop up window unless its src="http://localhost:8080/test/document.html?OnSale"
例如，iframe 不会加载到我的弹出窗口中，除非它 src="http://localhost:8080/test/document.html?OnSale"
I cannot figure out why the document.writein the body of my html page won't print out the dynamic iframe Im trying to create with my foo() function in the href links...
我无法弄清楚为什么document.write我的 html 页面的正文中不会打印出我试图在 href 链接中使用我的 foo() 函数创建的动态 iframe...
<div id="blanket" style="display:none;"></div>
<div id="popUpDiv" style="display:none;">
<a href="#" onclick="popup('popUpDiv')">
<img align="right" src="http://localhost:8080/test/img/close_img.png">
</a>
<script type="text/javascript">
function foo(obj)
{
test1 = "http://localhost:8080/test/document.html?"+obj.text;
document.write('<iframe height="450" allowTransparency="true" frameborder="0" scrolling="yes" style="width:100%;" src="'+test1+'" type= "text/javascript"></iframe>');
}
</div>
<a href="#" onclick="popup('popUpDiv');foo(this);">OnSale</a>
EDIT:Here is my full html page. Everything is running locally on tomcat7 w/ win7 and firefox.
编辑：这是我的完整 html 页面。一切都在带有 win7 和 Firefox 的 tomcat7 上本地运行。
<html>
<head>
<script type="text/javascript" src="http://localhost:8080/test/css-popup/css-pop.js"></script>
<link href="http://localhost:8080/test/css-popup/styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="blanket" style="display:none;"></div>
<div id="popUpDiv" style="display:none;">
<a href="#" onclick="popup('popUpDiv')">
<img align="right" src="http://localhost:8080/test/css-popup/x.png">
</a>
<script type="text/javascript">
function foo(obj){
test1 = "http://localhost:8080/test/document.html?"+obj.innerHTML;
document.write('<iframe height="450" allowTransparency="true" frameborder="0" scrolling="yes" style="width:100%;" src="'+test1+'" type= "text/javascript"></iframe>');
}
</script>
</div>
<a href="#" onclick="popup('popUpDiv');foo(this);">OnSale</a>
</body>
</html>
采纳答案by Okan Kocyigit
textis not a standard for all browsers, try innerHTMLinstead of that,
text不是所有浏览器的标准，尝试innerHTML代替它，
function foo(obj){
test1 = "http://localhost:8080/test/document.html?"+obj.innerHTML;
document.write('<iframe height="450" allowTransparency="true" frameborder="0" scrolling="yes" style="width:100%;" src="'+test1+'" type= "text/javascript"></iframe>');
}
UPDATED after you had shared your whole code,
在您共享整个代码后更新，
As I understand you want to open a popup window, and show an dynamically created iframe in it. But document.write works for your current window. So you have to handle your popup window at first. then change content of that.
据我了解，您想打开一个弹出窗口，并在其中显示一个动态创建的 iframe。但是 document.write 适用于您当前的窗口。所以你必须首先处理你的弹出窗口。然后更改内容。
try this,
尝试这个，
<html>
<head>
<script type="text/javascript" src="http://localhost:8080/test/css-popup/css-pop.js"></script>
<link href="http://localhost:8080/test/css-popup/styles.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="blanket" style="display:none;"></div>
<div id="popUpDiv" style="display:none;">
<a href="#" onclick="popup('popUpDiv')">
<img align="right" src="http://localhost:8080/test/css-popup/x.png">
</a>
<script type="text/javascript">
var popUpWindow;
function popup(n) {
popUpWindow = window.open(n);
}
function foo(obj){
test1 = "http://localhost:8080/test/document.html?"+obj.innerHTML;
popUpWindow.document.write('<iframe height="450" allowTransparency="true" frameborder="0" scrolling="yes" style="width:100%;" src="'+test1+'" type= "text/javascript"></iframe>');
}
</script>
</div>
<a href="#" onclick="popup('popUpDiv');foo(this);">OnSale</a>
</body>
</html>?
