一、父域访问子域的元素

项目需求:

  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. C++对象模型的那些事儿之五:NRV优化和初始化列表

    前言 在C++对象模型的那些事儿之四:拷贝构造函数中提到如果将一个对象作为函数参数或者返回值的时候,会调用拷贝构造函数,编译器是如何处理这些步骤,又会对其做哪些优化呢?本篇博客就为他家介绍一个编译器的 ...

  2. 当图片验证码遇上JSP

    今天看到了一个关于使用JSP方式生成图片验证码 的小例子,感觉真的是很不错,拿来分享一下. 原理 对于图片验证码,我们在审查元素的时候会方便的看出是<img src="#" ...

  3. Dynamics CRM 2015 Online Update1 UI界面的更新变化

    听说出  Dynamics CRM 2015 Online  Update1了,立马跑去申请了个30天试用版简单的看了下,UI上的变化还是让人耳目一新的,也可能是被CRM2013的UI蹂躏太久了没 ...

  4. iOS下WebRTC音视频通话(三)-音视频通话

    前两篇文章记录了音视频通话的一些概念和一些流程,以及一个局域网内音视频通话的示例. 今天以一个伪真实网络间的音视频通话示例,来分析WebRTC音视频通话的过程. 上一篇因为是在相同路由内,所以不需要穿 ...

  5. 套接字输入缓冲装置——InternalInputBuffer

    互联网的世界很复杂,信息从一端传向另一端过程也相当复杂,中间可能通过若干个硬件,为了提高发送和接收效率,在发送端及接收端都将引入缓冲区,所以两端的套接字都拥有各自的缓冲区,当然这种缓冲区的引入也带来了 ...

  6. Android初级教程理论知识(第一章快速入门)

    一.综合介绍. Android项目的目录结构 Activity:应用被打开时显示的界面 src:项目代码 R.java:项目中所有资源文件的资源id Android.jar:Android的jar包, ...

  7. python的文件操作file:(内置函数,如seek、truncate函数)

    file打开文件有两种方式,函数用file()或者open().打开后读入文件的内容用read()函数,其读入是从文件当前指针位置开始,所以需要控制指针位置用: 一.先介绍下file读入的控制函数: ...

  8. My Upload.com product submission has been approved

     This morning I got to know that My product DB Query Analyzer had been appoved by upload.com, which ...

  9. Linux信号实践(3) --信号内核表示

    信号在内核中的表示 执行信号的处理动作称为信号递达(Delivery),信号从产生到递达之间的状态,称为信号未决(Pending).进程可以选择阻塞(Block)某个信号.被阻塞的信号产生时将保持在未 ...

  10. 常用Map实现类对比

    翻译人员: 铁锚 翻译时间: 2013年12月12日 原文链接: HashMap vs. TreeMap vs. Hashtable vs. LinkedHashMap Map 是最常用的数据结构之一 ...