如何将两个单独的页面加载到两个单独的iFrame？_Iframe

如何将两个单独的页面加载到两个单独的iFrame？

iframe

如何将两个单独的页面加载到两个单独的iFrame？,iframe,Iframe,我有一个包含两个iframe的网页：iframe.main和iframe.secondary。我想知道是否有办法在加载iframe.main中的页面时将特定页面加载到iframe.secondary？我将尝试说明我想要实现的目标： <body> <iframe id="main" src=""> </iframe> <iframe id="secondary" src=""> </iframe> <button

我有一个包含两个iframe的网页：iframe.main和iframe.secondary。我想知道是否有办法在加载iframe.main中的页面时将特定页面加载到iframe.secondary？我将尝试说明我想要实现的目标：

<body>

 <iframe id="main" src="">

 </iframe>

 <iframe id="secondary" src="">

 </iframe>

 <button onClick="main.location.href='mainpage.html'">
  Load mainpage.html to iframe.main and secondary.html to iframe.secondary
 </button>

</body>


将mainpage.html加载到iframe.main，将secondary.html加载到iframe.secondary

那么，如何将secondary.html加载到iframe.secondary，就像mainpage.html加载到iframe.main一样？我可以用button的onClick事件或mainpage.html的onLoad事件来完成吗

在单击按钮时更改/设置两个iFrame的

src

属性。下面是一个使HTML更加精简的示例：


两个iframe
window.onload=函数（）{
//获取将触发操作的按钮
var b=document.getElementById（'trigger'）；
//并在此处而不是在HTML中设置onclick处理程序
b、 onclick=doLoads；
//上面的onclick处理程序的回调函数
函数doLoads（）{
//拿两个iframe
var m=document.getElementById（'main'）；
var s=document.getElementById（'secondary'）；
//并设置源URL
m、 src=“mainpage.html”；
s、 src=“secondary.html”；
}
//您还可以将doLoads（）代码移动到匿名函数中，如下所示：
//b.onclick=function（）{var m=…etc.}
} 


加载两个页面

非常感谢您！接下来，我考虑以下内容：假设iframe.secondary将有一些默认页面，我们称之为default.html。当我将页面保留在iframe.main中时，如何将iframe.secondary中加载的页面更改为default.html？不确定“将页面保留在iframe.main中”是什么意思。您可以将次要iframe的初始

src

设置为“default.html”，并在加载“secondary.html”后添加另一个按钮将其重新设置为默认值。对于更复杂的交互，我建议您研究jQuery或其他框架，因为普通JavaScript往往会变得笨拙。另一个问题（对不起）：如何将body onload事件设置为main.html，从而触发iframe.seconday中secondary.html的加载？我已经试着想好了怎么做，但是没有成功…如果你想在主页加载时secondary.html已经在secondary iframe中，那么就用简单（正常）的方式来做；）只需在HTML中编写

。没有必要使用JavaScript。该按钮（及其JS）仅用于在初始加载main之后动态更改iframe源。