iFrame页面如何向父页面传值

2024-10-14 16:43:13

1、首先：搭建开发环境在MyEclipse中创建一个Java Web项目，并导入jQuery运行库：

3、<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html> <head> <base href="<%=basePath%>"> <title>子页面</title>

5、<body> <p>嵌套的iFrame页面</p> 请输入一些值：<input type="text"id="someValue"/> <button onclick="transfer();">开始传值</button> <script type="text/javascript"src="jquery.js"></script> <script type="text/javascript">

7、创建一个父页面：Index.jsp:<%@ page language="java"import="java.util.*"pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%>

9、<meta http-equiv="pragma"content="no-cache"> <meta http-equiv="cache-control"content="no-cache"> <meta http-equiv="expires"content="0"> <meta http-equiv="keywords"content="keyword1,keyword2,keyword3"> <meta http-equiv="description"content="This is my page"> </head>

11、<div style="margin:20px auto; width:300px;"> <iframe src="children_page.jsp"width="300"height="100"frameborder="1"scrolling="auto"></iframe> </div> </body></html>

13、在iFrame中填写了“Hello，Steve Jong!”后，点击按钮，把值传递到了父页面的文本框中：