从另一个html文件更改iframe的src？ [英] Change an iframe's src from another html file?
问题描述
好吧，我有无线电元素用 js代码<更新 iFrame / code>;并且工作正常。
Well, I have my radio elements that update an iFrame with js code; and that works fine.
然后我在按钮下创建一个 iFrame 在 HTML部门中，在列表中包含一堆o'按钮，我的目标是单击 iFrame 中的其中一个按钮然后使用该按钮更新上面的 iFrame （由收音机的控制的那个）。
Then I have my button below that creates an iFrame in a HTML Division that contains a bunch o' buttons in a list, my aim is to click one of these buttons in the iFrame then have that button to update the above iFrame (the one controlled by the radio's).
这怎么可能，可以有人帮我吗？提前致谢。
How is this possible, can anyone help me? Thanks in advance.
注意：我尝试使用< link rel =importhref =parentpage.html> 导入它的ID（如果是这样？）然后尝试使用 JS 以这种方式更新它，但无济于事。
Note: I've tried using <link rel="import" href="parentpage.html"> to import its ID's (if it does that?) then tried using JS to update it that way, to no avail.
它看起来像什么（布局明智）！
What it looks like (layout wise)!
推荐答案
假设所有帧都在同一个域中，可以这样做：
Assuming all the frames are in the same domain, this can be done like this:
<html>
<head>
<title>Main Page</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
var change_iframe1_src = function(new_src) {
$("#iframe1").attr('src', new_src);
}
</script>
</head>
<body>
<!-- frame for which we will change src attribute -->
<iframe id="iframe1" src="" width="400" height="200" border="1"></iframe>
<!-- frame which includes your iframe2 with the buttons-->
<iframe src="iframe.html" width="200" height="200" border="1"></iframe>
</body>
</html>
现在在iframe2文件中附加按钮的点击处理程序，它应该更改iframe1的src属性通过调用主页面中定义的函数。
Now in the iframe2 file attach a click handler for your buttons that should change the src attribute of the iframe1 by calling a function defined in the main page.
示例：
<html>
<head>
<title>iFrame 2</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("button").click(function(e) {
e.preventDefault();
// call function in a parent frame - IMPORTANT LINE BELOW :)
parent.window.change_iframe1_src(this.rel);
})
})
</script>
</head>
<body>
<button rel="iframe3.html">Change iframe src to iframe3.html</button>
<button rel="iframe4.html">Change iframe src to iframe4.html</button>
</body>
iframe 2中的链接页面调用在父窗口中定义的函数（主页/嵌入iframe2页面本身的窗口）。该函数（在此示例中为change_iframe1_src）采用一个参数，这是一个新的url。
框架#iframe1（您的第一帧）的src属性将更改为此网址。
The links in the iframe 2 page call the function which is defined in the parent window (the main page / the window which embeded the iframe2 page itself). That function (change_iframe1_src in this example) takes one argument which is a new url. The src attribute of the frame #iframe1 (your first frame) will be changed to this url.
同样，只要所有框架都是在同一个域中。
Again, this works as long as all the frames are in the same domain.
希望它有所帮助:) 来源
Hope it helped :) Source
这篇关于从另一个html文件更改iframe的src？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
