javascript - 从另一个 iframe 更改 iframe 源

标签 javascript iframe

好的,我在父页面中有 2 个 iframe(无论出于何种原因)。

我在父页面上有一个导航菜单,它更改了 iframe #1 的源...

iFrame #1 的工作是显示另一个导航菜单...就像子导航菜单...

现在,我如何在点击 iFrame #1 中的 li 后更改 iframe #2 的源?它们都在同一个父页面上...

除了惨败之外,我还收到了来自 Chrome 开发工具的警告 -

不安全的 JavaScript 尝试从具有 URL file:///C:/website/news/navigator.html 的框架访问具有 URL file:///C:/website/index.html 的框架。域、协议(protocol)和端口必须匹配。

这里有一些代码可以让事情变得更清晰:

HTML

<!-- HTML for the parent page itself -->
<iframe id="frameone" src=""></iframe>
<iframe id="frametwo" src=""></iframe>
<button onclick="onenav('test.html')">Change 1st frame</button>

<!-- The following is the HTML that is loaded inside "frameone" -->
<button onclick="twonav('test2.html')">Change 2nd frame</button>

// Javascript
var one = document.getElementById('frameone');
var two = document.getElementById('frametwo');

function onenav(x){
    one.src = x;
}

function twonav(y){
    two.src = y;
}

对我来说,这是有道理的,因为这一切都在父页面上执行...加载时,我查询开发工具,我可以看到“一”和“二”都有框架元素。 . 第一个按钮有效,第二个按钮无效...

最佳答案

在使用 parent.twonav 时对我有用

DEMO

var links = [
    'javascript:\'<button onclick="parent.twonav(1)">Change 2nd frame</button>\'',
    'javascript:\'Hello\''
];
var one, two;
window.onload=function() {
  one = document.getElementById('frameone');
  two = document.getElementById('frametwo');
}  

function onenav(idx) {
    one.src=links[idx];
}  

function twonav(idx) {
    two.src=links[idx];
}  

关于javascript - 从另一个 iframe 更改 iframe 源,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6166357/

相关文章:

javascript - 将 UTF 8 字符串代码(代码保存在字符串变量中)转换为 UTF 16 字符串(实际 utf 16 个字符)

google-chrome - 如何在 Chrome 中自动播放带有视频的 iframe

javascript - 使用 Javascript 将链接转换为 iframe

java - 如何在java中让body保存iframe的内容

html - 在 iframe 源页面中使用元刷新标记会导致页面刷新已调用 iframe 的位置

javascript - 如何获得 iFrame 的选择?

javascript - 在图像上使用 onClick 来显示文本

javascript奇怪的行为

javascript - 在 karma 中使用 angular.mock.inject 给出 "TypeError: Cannot read property ' $injector' of null"

javascript - 获取当前焦点输入文本字段的索引