视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
iframe中子父类窗口调用JS的方法及注意事项_javascript技巧
2020-11-27 21:42:41 责编:小采
文档


一、前言

我页面用的是EasyUI的弹出窗口里面嵌入一个iframe。

第一:父窗口打开子窗口是一个新增用户信息的iframe子页面,点击保存后,子窗口iframe则去调用父窗口的function closeAddWindow()方法,让父窗口去关闭新增页面;

第二:父窗口打开一个设置用户权限的iframe子窗口,首先打开这个子窗口会全部加载数据库表中所有的存在的权限,然后子窗口需要把加载的权限信息拼接html Append到一个ID为

上,这里有个问题就是父窗口打开子窗口加载所有权限后根本无法把html 追加到id="tb"的表格上,这个原因很简单,因为父窗口调用子窗口加载所有权限信息的后,没有找到表格元素,因为子页面还没有完全加载完成,这种情况处理在这里也介绍了,给iframe注册一个onload事件,等加载完成后再去调用追加的方法。

好了,简单到这里,让我们瞧瞧更多的事例吧!!~~~~~~(*^__^*) 嘻嘻……

二、iframe子父窗口方法调用

2.1语法使用

1、父窗口嵌入iframe

代码如下:

2、父窗口调用子窗口方法

代码如下:
myFrame.window.sonMethod();

3、子窗口调用父窗口方法

代码如下:
parent.fatherMethod();

4、兼容浏览器的iframe 加载完成方法



2.2语法代码

Father.html




 
 


 我是父窗口内容
 
 


FChild.html





 


 我是子窗体内容 
  
 

三、什么情况下使用到 myFrame.onload 或者 myFrame.attachEvent

这里使用的是easyui框架前端框架


 
  
 

四、总结几个关键点吧

父子窗口方法的调用,注意加载的先后顺序才能获取到想要的结果,遇到问题常用alter()测试或者浏览器的开发者工具监控

以上内容就是本文中介绍iframe中子父类窗口调用JS的方法及注意事项,希望大家喜欢。

下载本文
显示全文
专题