您的位置：首页 > 其它

在frameset，frame，iframe中如何操作其他框架中的页面以及如何刷新框架中的页面

2012-09-20 10:32 295 查看

frameset，frame，iframe可以让我们很好的布局整个web页面。

每个web工程没有不用到这些的，那在frameset，frame，iframe中如何操作其他框架中的页面以及如何刷新框架中的页面？

这个是很常用的，如果你对这个不熟悉，那你只能算是个会写java后台代码的菜鸟，

前台的页面控制很能看出程序员的水平。

先看一个实际项目中的例子：

main.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"	pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>客户服务中心系统</title>
<link rel="shortcut icon" href="<%=path%>/resource/images/favicon.ico" type="image/x-icon"/>
</head>
<frameset rows="124,*,36" frameborder="no" border="0" framespacing="0">
<frame src="../jsp/hd/top.jsp" name="topFrame" scrolling="No" noresize="noresize" id="topFrame" title="topFrame" />
<frame src="../jsp/hd/home/homeframe.html" name="mainFrame" id="mainFrame" title="mainFrame" />
<frame src="../jsp/hd/foot.jsp" name="bottomFrame" scrolling="No" noresize="noresize" id="bottomFrame" title="bottomFrame" />
</frameset>
<noframes>
<body>

</body></noframes>

</html>

homeframe.html

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>框架</title>
</head>
<frameset cols="260,*" frameborder="no" border="0" framespacing="0" id="lrsplitframe" name="lrsplitframe">
<frame src="homeleft.jsp"  id="homeleft" name="homeleft" scrolling="no" noresize="noresize"  noresize/>
<frame src="homeright.jsp" id="homeright"  name="homeright"  scrolling="no"   noresize/>
</frameset>
<noframes><body>
</body></noframes>
</html>

如果在homeright签入一个框架页面:

module.jsp

<%@ taglib uri="/struts-tags" prefix="s"%>
<%
String otherParam = request.getParameter("otherParam");
if(otherParam == null){
otherParam = "";
}
%>
<html>
<head>
<title></title>
</head>
<frameset id="MAINFRAMESET" rows="300,10,*"  border="0" frameborder="0" frameSpacing="0">
<frameset rows="0pt,*" frameborder="NO" border="0" framespacing="0">
<frame src='<%=request.getContextPath()%>/mainMenu.action?parentMenuId=<%=request.getParameter("parentMenuId")%>&otherParam=<%=otherParam%>' id="MAINMENU" name="MAINMENU" scrolling="NO" noresize>
<frame src="" name="MAINCONTENT" noresize >
</frameset>

<frame  id="MENUBAR" name="MENUBAR" src="<%=request.getContextPath()%>/jsp/layout/menubar.jsp"  noresize scrolling="no" frameborder="0" pos="1">

<frameset rows="35,*" frameborder="NO" border="0" framespacing="0" id="CONTENTFRAMESET">
<frame src='<%=request.getContextPath()%>/subMenu.action?parentMenuId=<%=request.getParameter("parentMenuId")%>&otherParam=<%=otherParam%>' id="SUBMENU" name="SUBMENU"  scrolling="NO" noresize>
<frame src="" name="SUBCONTENT">
</frameset>
</frameset>
<noframes><body>

</body></noframes>
</html>

整体的布局可以用一张图来看，这样更清楚：

上面的MAINCONTENT中嵌入listphonebook.jsp

我们想在listphonebook.jsp中调用其他页面的方法或者刷新某个frame中的页面应该怎么做呢？

比如homeleft.jsp中有个方法：

function gg(){

alert("gg");

}

方法1：使用parent跳出本框架再找其他框架。

一，刷新listphonebook.jsp

（

当然也可以window.location.reload();

不过这个刷新会有IE的提示框弹出，效果不是很好。

所以把右面所有页面刷新

parent.window.parent.window.frames[1].window.location.reload();

）

刷新左面homeleft.jsp

parent.window.parent.window.frames[0].window.location="xxx.jsp";

parent.window.parent.window.frames[0].window.location.reload();

二，调用homeleft.jsp中的方法

parent.window.parent.window.frames[0].gg();

parent.window是homeright

parent.window.parent.window是mainFrame

parent.window.parent.window.frames[0]是homeleft.jsp

这样就可以调用这个页面的方法gg()；

方法2：使用top跳到本页面的顶层框架，然后一层层按从外向里的顺序找到你要的页面。

一，刷新listphonebook.jsp

那在此页面可以

top.mainFrame.homeright.location="<%=path%>/jsp/layout/module.jsp?parentMenuId=hd_phonebook";

或者

top.mainFrame.homeright.location.reload();

刷新左面homeleft.jsp

top.mainFrame.homeleft.location="xxx.jsp";

或者

top.mainFrame.homeleft.location.reload();

二，调用homeleft.jsp中的方法

top.mainFrame.homeleft.window.gg();

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航