脚本操作框架页面
测试环境：IE6、IE9、火狐
JQUERY引用地址：
<script type="text/javascript"src="code.jquery/jquery-latest.js"></script>
1、IFRAME框架
页面示例：
<iframe id="ifr1"frameborder="1"scrolling="no"src="H16-1.htm"sty le="width: 45%; height: 250px"></iframe>
<iframe id="ifr2"frameborder="1"scrolling="no"src="H16-2.htm"sty le="width: 45%; height: 250px"></iframe>
父页面包含两个子框架分别是IFR1 IFR2
1）父页面调用子页面
A、父页面获取IFR1框架内的文本框，并且写入内容
var obj = ElementById("ifr1").contentWindow;
//JQUERY方法
//$("#txt1",obj.document).val("父页面写入子页面" + Math.floor(Math.random()*1000));
//JAVASCRIPT方法
ElementById("txt1").value = "11父页面写入子页面"+ Math.floor(Math.random()*1000);
B、父页面调用框架页面的函数（AddMsg为IFR1框架内的函数）
var obj = ElementById("ifr1").contentWindow;
obj.AddMsg("父页面调用子页面函数写入信息" + Math.floor(Math.random()*1000));
C、父页面重写子框架链接
//重写子框架链接
//JQUERY方法
//$("#ifr1").attr("src",$("#ifr1").attr("src"));
//JAVASCRIPT方法
ElementById("ifr1").src = ElementById("ifr1").src;
D、使用[]方式获取框架对象
//使用[]方式获取框架对象
//JQUERY方法
//$(window.frames["ifr1"].document).find("input[type='radio']").attr("checked","true");
//JAVASCRIPT方法
window.frames["ifr1"].ElementById("txt1").value = "11这是父页面写入的内容"; 2）框架页操作父页面
A、获取父页面元素并且赋值
//获取父页面元素并且写入数据
//JQUERY方法
//$("#msg",parent.window.document).html("获取父页面元素，并且写入数据！！！" + Math.random());
//JAVASCRIPT方法
parent.ElementById("msg").innerHTML = "11获取父页面元素，并且写入数据！！！" + Math.random();
B、调用父页面函数
//调用父页面函数AddMsg---父页面函数
parent.window.AddMsg("11调用父页面函数，写入内容" + Math.random());
3）兄弟框架互操作
A、获取兄弟框架元素并赋值
//获取兄弟框架元素并且写入数据IFR2获取IFR1中的元素
//JQUERY方法
//$("#ifr1",parent.document).contents().find("#txt2").val("这是框架IFR2写入的" + Math.random());
//JAVASCRIPT方法
ElementById("ifr1").ElementById("txt2").valu
e = "11这是框架IFR2写入的" + Math.random();
B、调用兄弟框架函数
//调用兄弟框架函数IFR2调用IFR1中的函数
//JQUERY方法
//$("#ifr1",parent.document)[0].contentWindow.AddMsg("这也是框架2调用1的函数写入的" + Math.random());
//JAVASCRIPT方法
ElementById("ifr1").contentWindow.AddMsg("11这也是框架2调用框架1的函数写入的" + Math.random());
2、FRAMESET框架
页面示例
<frameset id="framesx"border="1"frameSpacing="5"rows="165,*"frameBorder="1" runat="server"width="100%">
<frame id="ifr1"name="ifr1"frameSpacing="5"marginWidth="0"marginHeight="0" src="h16a-1.htm"noResize scrolling="no"target="">
<frameset id="mainframe"border="1"frameSpacing="5"frameBorder="1"cols ="50%,50%"runat="server">
<frame id="ifr2"name="ifr2"marginWidth="20%"marginHeight="100px" src="h16a-2.htm"noResize scrolling="no">
<frame width="100%"id="ifr3"name="ifr3"marginWidth="0"marginHeight="0" src="h16a-3.htm"noResize scrolling="auto">
</frameset>
</frameset>
页面分为：上--左：右模式上面是IFFR1 左面是IFR2 右面是IFR2 在火狐测试时发现必须使用NAME属性，建议将ID和NAME设置为相同的名字
1）获取其他框架元素并赋值
本例通过上部页面（IFR1）操作左侧页面（IFR2）
jquery的attr属性
//JQUERY方法
//$("#div",window.parent.frames["ifr2"].document).html("获取兄弟框架，并且写入数据！！！" + Math.random());
//JAVASCRIPT方法
window.parent.frames["ifr2"].ElementById("div").innerHTML = "1获取兄弟框架，并且写入数据！！！" + Math.random();
2）调用其他框架页面函数
//JQUERY
//$(window.parent.frames["ifr2"])[0].add("调用兄弟框架函数");
//JAVASCRIPT方法
window.parent.frames["ifr2"].add("调用兄弟框架函数11");

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。