Iframe 父页面与子页面相互js调用实现

最新推荐文章于 2024-01-17 10:27:48 发布

passport_daizi

最新推荐文章于 2024-01-17 10:27:48 发布

阅读量1k

点赞数

分类专栏： 01 Html 02 Jsp 03 JavaScript

本文链接：https://blog.csdn.net/kalision/article/details/49584107

版权

01 Html 同时被 3 个专栏收录

41 篇文章 0 订阅

订阅专栏

03 JavaScript

33 篇文章 0 订阅

订阅专栏

02 Jsp

29 篇文章 0 订阅

订阅专栏

tag：ifame 子页面调用父页面，父页面子页面

index.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>My JSP 'index.jsp' starting page</title>
		<script type="text/javascript">
			function say() {
				alert("父页面被调用了！");
			}
			function callChild() {
				frame1.window.say();
			}
		</script>
	</head>
	<body>
		<input type="button" value="调用子页面" οnclick="callChild()"><br/>
		<iframe name="frame1" src="demo.jsp"></iframe>
	</body>
</html>

demo.jsp

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>My JSP 'demo.jsp' starting page</title>
	<script type="text/javascript"> 
		function say() 
		{ 
		alert("子页面被调用了！"); 
		} 
		function callParent() { 
			parent.say(); 
		} 
	</script> 
</head> 
<body> 
<input type="button" value="调用父页面" οnclick="callParent()"> 
</body> 
</html>