PHP8.1.21版本已发布
vue8.1.21版本已发布
jquery8.1.21版本已发布

内嵌页面iframe以及和其兄弟iframe的相互传值_html/css_WEB-ITnose

原创
2016-06-21 09:16:08 1050浏览

主要知识点

1:document.getElementById("ii").contentWindow 得到iframe对象后,就可以通过contentWindow得到iframe包含页面的window对象,然后就可以正常访问页面元素了;

2:$("#ii")[0].contentWindow  如果用jquery选择器获得iframe,需要加一个【0】;

3:$("#ii")[0].contentWindow.$("#dd").val() 可以在得到iframe的window对象后接着使用jquery选择器进行页面操作;

4:$("#ii")[0].contentWindow.hellobaby="dsafdsafsdafsdafsdafsdafsadfsadfsdafsadfdsaffdsaaaaaaaaaaaaa"; 可以通过这种方式向iframe页面传递参数,在iframe页面window.hellobaby就可以获取到值,hellobaby是自定义的变量;

5:在iframe页面通过parent可以获得主页面的window,接着就可以正常访问父亲页面的元素了;

6:parent.$("#ii")[0].contentWindow.ff; 同级iframe页面之间调用,需要先得到父亲的window,然后调用同级的iframe得到window进行操作;

源码

源码包含内容,主页面(main.html)中含有两个iframe子页面(frame.html,newIframe.html)

主页面如何调用子页面中的方法;

子页面如何调用主页面中的方法;

两个子iframe之间如何如何进行交互

main.html:

显示图表
参数传递 调用子iframe方法 调用子iframe变量 调用子iframe组件

frame.htm:

显示图表
接受参数 调用子iframe方法 调用主窗口变量 调用子iframe组件

兄弟iframe页面 newIframe.htm

显示图表
调用兄弟iframe

如果是在easyui的tab的选项卡中,有个实例这么做:

//得到被选中的tab对象        var tab=parent.$("#tabs").tabs("getSelected");//该iframe是在tab选项卡中的一个内嵌的iframe,获取该页面的id为tableId的值tab.panel("body").find("iframe")[0].contentWindow.$("#tableId").val(id);//获取被选中的tab的内嵌页面iframe的id为clcs的datagrid,并重新加载数据tab.panel("body").find("iframe")[0].contentWindow.$('#clcs').datagrid('reload');


声明:本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn核实处理。