一、父域访问子域的元素

项目需求:

  iFrame是个聊天窗口,要求聊天窗口中点击图片图标,在父域将内容展示出来。

解决方法:(jQuery)

  首先/要等iFrame加载完再执行函数!(代码如下)

   var isOnLoad = true;

    $('#iframe_con').load(function() {
          isOnLoad = false;// 加载完成
         Apple();
     });

  然后/在父域里选择子域的元素添加事件和完成函数即可!(代码如下)  

    //模态框
   function Apple(){

    var oE={
      wheight:$(window).height(),
      wwidth:$(window).width(),
      showdown:$('.showdown'),
      Apple:$('.Apple_wait'),
      Close:$('.ApClose'),
      Btn:$('#iframe_con').contents().find('.Apactive_chat')//选择子域的元素
      };

    oE.showdown.height(oE.wheight>$('html').height()?oE.wheight:$('html').height());

    oE.Apple.css({left:(oE.wwidth-560)/2,top:(oE.wheight-207)/2+$(window).scrollTop()});

    oE.Btn.click(function(){//给子域的元素绑定事件

      oE.showdown.fadeIn();
      oE.Apple.fadeIn();
    });

    oE.Close.click(function(){
      oE.showdown.fadeOut();
      oE.Apple.fadeOut();
   });

二、子域访问父域的元素    

function zgz(){

$(window.parent.$("#maindiv").html("子页面赋过来的值"));

}  

前端iFrame跨域问题的更多相关文章

  1. [转] js前端解决跨域问题的8种方案(最新最全)

    1.同源策略如下: URL 说明 是否允许通信 http://www.a.com/a.jshttp://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.j ...

  2. [1.6W字] 浏览器跨域请求限制的详细原理分析&寻找一种最简单的方式实现XHR跨域(9种方法, 附大招可以纯前端实现跨域!)

    Title/ 浏览器跨域(CrossOrigin)请求的原理, 以及解决方案详细指南 #flight.Archives011 序: 最近看到又有一波新的创作活动了, 官方给出的话题中有一个" ...

  3. JS跨域(ajax跨域、iframe跨域)解决方法及原理详解(jsonp)

    这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协议.域名.端口有任何一个不同,都被 ...

  4. javascript跨域、iframe跨域访问

    1.window 对象 浏览器会在其打开一个 HTML 文档时创建一个对应的 window 对象.但是,如果一个文档定义了一个或多个框架(即,包含一个或多个 frame 或 iframe 标签),浏览 ...

  5. iframe跨域cookie问题

    今天在项目里面遇到了iframe跨域不能写cookie的问题.应用场景是这样的:有A和B两个业务,A要通过iframe的方式嵌入B,但是在ie下A不能通过写cookie的方式记录信息,在firefox ...

  6. iframe跨域访问

    js跨域是个讨论很多的话题.iframe跨域访问也被研究的很透了. 一般分两种情况: 一. 是同主域下面,不同子域之间的跨域: 同主域,不同子域跨域,设置相同的document.domian就可以解决 ...

  7. 利用location.hash+iframe跨域获取数据详解

    前言 如果看懂了前文利用window.name+iframe跨域获取数据,那么此文也就很好理解了.一样都是动态插入一个iframe,然后把iframe的src指向服务端地址,而服务端同样都是输出一段j ...

  8. 利用window.name+iframe跨域获取数据详解

    详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...

  9. CP="CAO PSA OUR" 用P3P header解决iframe跨域访问cookie

    1.IE浏览器iframe跨域丢失Session问题 在开发中,我们经常会遇到使用Frame来工作,而且有时是为了跟其他网站集成,应用到多域的情况下,而Iframe是不能保存Session的因此,网上 ...

随机推荐

  1. 【一天一道LeetCode】#242. Valid Anagram

    一天一道LeetCode 本系列文章已全部上传至我的github,地址:ZeeCoder's Github 欢迎大家关注我的新浪微博,我的新浪微博 欢迎转载,转载请注明出处 (一)题目 Given t ...

  2. SDL2源代码分析7:显示(SDL_RenderPresent())

    ===================================================== SDL源代码分析系列文章列表: SDL2源代码分析1:初始化(SDL_Init()) SDL ...

  3. Windows Server2012R2 添加Microsoft .NET Framework 3.5 功能失败的解决方法

    最近部署了一台Windows Server2012R2的虚机,在安装sharepoint foundation 2013之前安装必备的组件的时候安装到一半报错了没有安装成功,后来发现原来是系统的.NE ...

  4. iOS中 读取相册,调用系统相机 技术分享

    技术内容:分别读取相册以及调取相机,将图片显示到imageView上 布局: 1.创建imageView 和 button 并为button一个关联pickerImage的事件 <div sty ...

  5. 谈谈Ext JS的组件——布局的使用方法续二

    绝对布局(Ext.layout.container.Absolute) 绝对布局让我回想到了使用Foxpro开发的时候,哪时候的界面布局就是这样,通过设置控件的左上角坐标(x,y)和宽度来进行的,因为 ...

  6. C++ Primer 有感(标准库set类型)

    set容器只是单纯的键的集合,键必须为一.set容器不支持下标操作,而且没有定义maped_type类型.在set容器中,value_type不是pair类型,而是与key_type类型相同的类型. ...

  7. java Domj4读取xml文件加强训练案例

    需求:给出一段xml文件.要求按照鸳鸯输出. xml文件代码如下: <?xml version="1.0" encoding="utf-8"?> & ...

  8. FSG报表打印报错,log文件显示java.sql.SQLException: No corresponding LOB data found

    报错信息: +---------------------------------------------------------------------------+ Plsql 程序的日志信息开始 ...

  9. ios入门OC_UI晋级学什么?

    1. OC 语法初步, 你可能学到面向对象最近本的概念, 并且可以大致的建立几个自以为是的类,但这仅仅是开始. 你知道为什么面向对象要有3大特性么.知道他们是用到什么设计模式的么 2. 你可能学到了N ...

  10. SpriteBuilder复杂CCB在App场景加载时报错排查

    Player.CCB由body和arm两部分组成,它们都开启物理使能. 在GameScene.ccb中新建一个物理对象,将Player.ccb拖入该对象.此时编译运行App均正常. 然后继续添加其他物 ...