iframe中将子页面A中的某个变量值传到子页面B中

最新推荐文章于 2023-07-19 11:11:12 发布

bossin2014

最新推荐文章于 2023-07-19 11:11:12 发布

阅读量1.2k

点赞数

分类专栏： JAVA 文章标签： iframe 页面间传值

本文链接：https://blog.csdn.net/bossin2014/article/details/47656431

版权

JAVA 专栏收录该内容

10 篇文章 0 订阅

订阅专栏

iframe中将子页面A中的某个变量值传到子页面中，该功能要实现的是不通过后台，当子页面A的某个变量值传给子页面B。

步骤分3步：

第一步：在iframe总页面中要有一个用来传值的js。并且子页面间切换时要调用该js。js代码如下：

<script type="text/javascript">
function jjqkbgGetMsg(wsFrame1,wsFrame2) {
	var dyabgUuid = $("#" + wsFrame1).contents().find("#dyabgUuid").val();
	var nsrmc = $("#" + wsFrame1).contents().find("#nsrmc").val();
	var nsrsbh = $("#" + wsFrame1).contents().find("#nsrsbh").val();
	$("#" + wsFrame2).contents().find("#dyabgUuid").val(dyabgUuid);
	$("#" + wsFrame2).contents().find("#nsrmc").text(nsrmc);
	$("#" + wsFrame2).contents().find("#nsrsbh").text(nsrsbh);
}

</script>

调用该js方法的代码如下：

    	<div class="userLayoutTitle" style="margin-bottom:0px;">	
			<ul class="fl">
                <li class="li-press" id="newsTab_1" οnclick="HoverLi_news(1)">大案要案情况报告表</li>
                <li class="" id="newsTab_2" οnclick="HoverLi_news(2);jjqkbgGetMsg('wsFrame1','wsFrame2');">检查情况报告</li> 
            </ul>
		</div>

用来链接子页面的， id="wsFrame1"，id="wsFrame2" 一定要有，传入js中

        <div class="newsdlTab dis" id="newsBox_1" >
     		<iframe frameborder="0" scrolling=no name="wsFrame1" height="1200px;" width="100%" id="wsFrame1" src="${base}/dabg/toEdit?ajxxUuid=${ajxxUuid}&lx=${lx}&dyabgUuid=${dyabgUuid}"></iframe>
        </div>
        <div class="newsdlTab none" id="newsBox_2">
     		<iframe frameborder="0" scrolling=no name="wsFrame2" height="1200px;" width="100%" id="wsFrame2" src="${base}/dabg/toEdit2?ajxxUuid=${ajxxUuid}&lx=${lx}&dyabgUuid=${dyabgUuid}"></iframe>
        </div>

iframe总页面整体代码如下：feny.ftl

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>报告大案要案</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="${base}/resource/js/changejs.js" type="text/javascript"></script> <!--iframe实现页面切换时引入的js-->

<script type="text/javascript">
function jjqkbgGetMsg(wsFrame1,wsFrame2) {
	var dyabgUuid = $("#" + wsFrame1).contents().find("#dyabgUuid").val();
	$("#" + wsFrame2).contents().find("#dyabgUuid").val(dyabgUuid);
}

</script>
</head>

<body>
<!--主体开始-->
<div class="wrap">
    	<div class="userLayoutTitle" style="margin-bottom:0px;">	
	    <ul class="fl">
                <li class="li-press" id="newsTab_1" οnclick="HoverLi_news(1)">大案要案情况报告表</li>
                <li class="" id="newsTab_2" οnclick="HoverLi_news(2);jjqkbgGetMsg('wsFrame1','wsFrame2');">检查情况报告</li>
                <li class="" id="newsTab_3" οnclick="HoverLi_news(3);jjqkbgGetMsg('wsFrame1','wsFrame3');">案件查处情况报告书</li>
            </ul>
	</div>
		
        <div class="newsdlTab dis" id="newsBox_1" >
     		<iframe frameborder="0" scrolling=no name="wsFrame1" height="1200px;" width="100%" id="wsFrame1" src="${base}/dabg/toEdit?ajxxUuid=${ajxxUuid}&lx=${lx}&dyabgUuid=${dyabgUuid}"></iframe>
        </div>
        <div class="newsdlTab none" id="newsBox_2">
     		<iframe frameborder="0" scrolling=no name="wsFrame2" height="1200px;" width="100%" id="wsFrame2" src="${base}/dabg/toEdit2?ajxxUuid=${ajxxUuid}&lx=${lx}&dyabgUuid=${dyabgUuid}"></iframe>
        </div>
         <div class="newsdlTab none" id="newsBox_3">
     		<iframe frameborder="0" scrolling=no name="wsFrame3" height="1500px;" width="100%" id="wsFrame3" src="${base}/dabg/toEdit3?ajxxUuid=${ajxxUuid}&lx=${lx}&dyabgUuid=${dyabgUuid}"></iframe>
        </div>
</div>
<!--主体完-->
</body>
</html>

第二步：子页面A中要有 <input id="dyabgUuid" name="dyabgUuid" type="hidden" class="input4" /> （此处只演示传dyabgUuid）
子页面整体代码如下：qkb.ftl

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>大案要案情况表报告</title>
<#include "/common/resource.ftl"> <!--引入一些头文件-->
</head>

<body>
<!--操作菜单开始-->
 <div class="tools_bar">
        <a title="保存" onClick="commitSave1('N');" class="tools_btn"><span><b class="tool_save">保存</b></span></a>
	</div>
     
        <form id="qkb" name="qkb"  method="post" >
	     <input id="dyabgUuid" name="dyabgUuid" type="hidden" class="input4" value="${jcDyabg.dyabgUuid}" />

        <!--此处为表单内容-->
	</div>
        </form>
</body>
</html>

第三步：子页面B要有 <input id="dyabgUuid" name="dyabgUuid" type="hidden" class="input4" />

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>大案要案情况表报告</title>
<#include "/common/resource.ftl">
</head>

<body>
<!--主体开始-->
<div class="tools_bar">
    <a title="保存" οnclick="commitSave();" class="tools_btn"><span><b class="tool_save">保存</b></span></a>
</div>
        <!--操作菜单开始-->
<form id="jcqkForm" method="post"  action="${base}/dabg/editJcqk">
	<div class="wrap_note">
	<input id="dyabgUuid" name="dyabgUuid" type="hidden" class="input4" />	
	<!--此处为表单内容-->
</form>

</body>
</html>