Window 对象

  浏览器会在其打开一个 HTML 文档时创建一个对应的 window 对象。但是,如果一个文档定义了一个或多个框架(即,包含一个或多个 frame 或 iframe 标签),浏览器就会为原始文档创建一个 window 对象,再为每个框架创建额外的 window 对象。这些额外的对象是原始窗口的 子窗口,可能被原始窗口中发生的事件所影响。例如,关闭原始窗口将导致关闭全部子窗口。如果想要创建新窗口(以及对应的 window 对象),可以使用像 open, showModalDialog 和 showModelessDialog 这样的方法。

contentWindow 属性

  contentWindow属性是指指定的frame或者iframe所在的window对象

  1.   var ifr = document.getElementById("iframe");  
      var contentWindow = ifr.contentWindow.document.getElementById("XXXXX");  
      contentWindow.method();  在iframe页面操作父页面DoM元素(即嵌套这个iframe的页面)可以用:  
      window.parent.    
      window.top.  (这里的TOP是获取的顶层,即有多层嵌套iframe的时候使用)
    ===========================================================
  1. /**
  2. * 人员选择
  3. * @param fieldName 字段名称(同时也是回显控件的ID)
  4. * @param type 控件类型(1:单选, 2: 多选)
  5. * */
  6. function userSelect(fieldName, type, callback) {
  7. layer.open({
  8. type: //此处以iframe举例
  9. , title: "选择用户"
  10. , area: ['800px', ($(window).height())+'px']
  11. , shade:
  12. , offset:'rb',
  13. scrollbar: false,
  14. shade:0.5,
  15. shift: ,
  16. fixed:false,
  17. resize:false,
  18. scrollbar:true,
  19. move:false
  20. , maxmin: false
  21. , content: 'appDataController.do?userSelect&type='+type //(url)
  22. , zIndex: layer.zIndex //重点1
  23. , success: function (layero) {
  24. layer.setTop(layero); //重点2
  25. }
  26. , btn: ['确定']
  27. , yes: function(index){
  28.  
  29. //  获得iframe的窗口对象
  30. var child = 'layui-layer-iframe'+index;
  31. $child = $("#"+child)[].contentWindow;
  32.  
  33. //  调用iframe的方法
  34. var data = $child.getUser();
  35. callback(fieldName, data);
  36. layer.close(index);
  37. }
  38. });
  39. }

另外一种layer,父子页面交互

var child = 'layui-layer-iframe'+index;
$child = $("#"+child)[0].contentWindow;
var data = $child.submit();

还有一个  

var iframeWin = window[layero.find('iframe')[0]['name']];
iframeWin.resetSelect();

iframe多窗口的更多相关文章

  1. 父窗口调用iframe子窗口方法

    一.父窗口调用iframe子窗口方法 1.HTML语法:<iframe name="myFrame" src="child.html"></i ...

  2. iframe 父子窗口相互之间调用语法

    一.父窗口调用iframe子窗口方法 1.HTML语法:<iframe name="myFrame" src="child.html"></i ...

  3. JS方法在iframe父子窗口间的调用

    本文向大家简单介绍一下iframe父子窗口间JS方法调用,JavaScript 被数百万计的网页用来改进设计.验证表单.检测浏览器.创建cookies,以及更多的应用,希望本文介绍对你有所帮助. if ...

  4. iframe父窗口和子窗口的调用方法

    iframe 父窗口和子窗口的调用方法父窗口调用子窗口 iframe_name.iframe_document_object.object_attribute = attribute_value 例子 ...

  5. HTML中IFrame父窗口与子窗口相互操作

    一.Iframe篇 //&&&&&&&&&&&&&&&&&&am ...

  6. iframe父子窗口取值

    父窗口中操作iframe:window.frames["iframeChild"].document //假如iframe的id为iframeChild 在子窗口中操作父窗口:wi ...

  7. iframe父窗口和子窗口之间的调用

    1>父窗口获取子窗口 js方法 document.getElementById('if1').contentWindow.document: window.frames["if1&qu ...

  8. 父窗口和iframe子窗口之间相互传递参数和调用函数或方法

    1.父窗口向子窗口传递参数: 可以在url中添加参数:2.html?a=1&b=2&c=3 然后在子页面上可用js解析,提供一个函数: function getQueryStr(sAr ...

  9. iframe与父窗口之间数据互相获取

    Js/Jquery获取iframe中的元素 博客分类: jquery javascript jquery  在web开发中,经常会用到iframe,难免会碰到需要在父窗口中使用iframe中的元素.或 ...

随机推荐

  1. 几个常用的SQL 时间函数

    --当月第一天declare @startFirstDate datetimeset @startFirstDate=dateadd(dd,datediff(dd,0,getdate()),-day( ...

  2. maven的web项目和shiro集成的问题

    在自定义shiro然后在加入spring的配置文件时,启动tomcat的时候一直报错 原因:刚学,对maven的依赖构建属性不熟悉 只是完成了maven父项目和子项目的依赖关系,并没有配置子项目之间的 ...

  3. Ubuntu 16.04.3 LTS 部署 Cloud Torrent

    下载安装程序 apt install -y curl sudo curl https://i.jpillora.com/cloud-torrent! | bash 写配置文件 sudo vim /et ...

  4. .NET 里delegate和event的区别

    最近一朋友找工作面试遇到这么个题目,正好我也对此有点模糊,遂进行了一番资料查询,找到了这个文章: http://www.cnblogs.com/chengxingliang/archive/2013/ ...

  5. 用最通俗的话解释AJAX是什么东西

    直白地说,就是没用AJAX的网页,你点一个按钮就要刷新一下页面,尽管新页面上只有一行字和当前页面不一样,但你还是要无聊地等待页面刷新. 用了AJAX之后,你点击,然后页面上的一行字就变化了,页面本身不 ...

  6. gt,gte,lt,lte缩写的含义

    gt: greater than 大于 gte: greater than or equal 大于等于 lt: less than 小于 lte: less than or equal 小于等于

  7. 在mvc中动态加载菜单

    最近做了一个项目, 要在客户端动态的显示菜单,也就是这些菜单是保存在数据库中的, 在客户端动态加载菜单,这样做的好处很明显,就是菜单很容易修改,直接在后台进行维护,再也不会直接在前面的 视图页面中进行 ...

  8. Redis数据结构深入解析

  9. ios8.1.1系统怎么取消下划线

    http://zhidao.baidu.com/link?url=y-3oAiOsuCSvoCD-7H2Uvgl_UI1BQQuNvA2jHKCRAGmZSH7_RrwDijKtRouMBa5yF_L ...

  10. IDEA Maven项目 编译的问题

    IDEA中,点击项目的maven插件的 compile: 出现: [INFO] ------------------------------------------------------------ ...