iframe多个内嵌网页间跳转
我在主页面里内嵌了多个iframe，如何实现相互跳转比如我在第一个iframe中点击button后，第二个iframe页面跳转。...
我在主页面里内嵌了多个iframe，如何实现相互跳转
比如我在第一个iframe中点击button后，第二个iframe页面跳转。 展开
比如我在第一个iframe中点击button后，第二个iframe页面跳转。 展开
1个回答
展开全部
主要使用window.parent（当前窗口的父窗口）和window['子窗口名']来完成，示例如下：
一共三个文件，1.htm放到第一个iframe中，2.htm放到第二个iframe中，3.htm为放置这两个iframe的父窗口。
3.htm内容：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<body>
<iframe src="1.htm" name="first" style="border:2px solid red "></iframe>
<iframe src="2.htm" name="second" style="border:2px solid blue "></iframe>
</body>
</html>
1.htm内容：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<script language="javascript">
function Change()
{
window.parent.window['second'].location='1.htm';
}
function Change2()
{
window.parent.window['second'].location='2.htm';
}
</script>
<body>
第一个文档
<input type="button" value="让第二个iframe显示1.htm" onClick="Change();">
<input type="button" value="让第二个iframe显示2.htm" onClick="Change2();">
</body>
</html>
2.htm内容：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<body>
第2个文档
</body>
</html>
一共三个文件，1.htm放到第一个iframe中，2.htm放到第二个iframe中，3.htm为放置这两个iframe的父窗口。
3.htm内容：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<body>
<iframe src="1.htm" name="first" style="border:2px solid red "></iframe>
<iframe src="2.htm" name="second" style="border:2px solid blue "></iframe>
</body>
</html>
1.htm内容：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<script language="javascript">
function Change()
{
window.parent.window['second'].location='1.htm';
}
function Change2()
{
window.parent.window['second'].location='2.htm';
}
</script>
<body>
第一个文档
<input type="button" value="让第二个iframe显示1.htm" onClick="Change();">
<input type="button" value="让第二个iframe显示2.htm" onClick="Change2();">
</body>
</html>
2.htm内容：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>无标题文档</title>
</head>
<body>
第2个文档
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
