一、父域访问子域的元素

项目需求:

  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. 开源项目——小Q聊天机器人V1.2

    小Q聊天机器人V1.0 http://blog.csdn.net/baiyuliang2013/article/details/51386281 小Q聊天机器人V1.1 http://blog.csd ...

  2. (NO.00004)iOS实现打砖块游戏(十四):3球道具的实现

    大熊猫猪·侯佩原创或翻译作品.欢迎转载,转载请注明出处. 如果觉得写的不好请告诉我,如果觉得不错请多多支持点赞.谢谢! hopy ;) 反弹棒变化道具实现前面已经介绍过了,我们下面可以在小球上做些文章 ...

  3. UE4实现描边效果

    描边效果属于常见常用的功能,现VR项目中,也需要射线选中一个物体,使物体高亮. 于是在网上找了部分资料,同时也感谢群里的一位大神的提点,总算将描边的功能实现了,这里也写一个简单的示例步骤. 1.我并不 ...

  4. MyEclipse10+Jdk1.7+OSGI+MySql实现数据库的增删改查

    开发环境: Windows2008R2 64位+MyEclipse10+jdk1.7.0_67+MySql5.5 软件安装:myeclipse-10.0-offline-installer-windo ...

  5. python脚本程序,传入参数*要用单引号'*'

    *号作为python脚本的传入参数时,必须用单引号'',才能正确传入.如python test.py 2014 '*' age python test.py 2014 * age是错误的. 比如 te ...

  6. Android进阶(十三)网络爬虫&json应用

    刚开始接触网络爬虫,怎一个"菜"字了得!经过几次的折磨,对其原理以及其中用到的json技术有了大致的了解,故作一总结,供有同样迷惑的朋友参考学习. 自己爬取的网站内容为12306的 ...

  7. Mybatis源码之Statement处理器PreparedStatementHandler(五)

    PreparedStatementHandler就是调用PreparedStatement来执行SQL语句,这样在第一次执行sql语句时会进行预编译,在接下来执行相同的SQL语句时会提高数据库性能 源 ...

  8. 存储那些事儿(五):BTRFS文件系统之Btree结构详解

    Btree数据结构可以说是BTRFS文件系统的基础.它提供了一个通用的方式去存储不同的数据类型.它仅仅存储3个数据类型:key, item和block header. btrfs_header的定义如 ...

  9. HTML5 window/iframe跨域传递消息 API

    原文地址:HTML5′s window.postMessage API 在线示例:Using HTML5's window.postMessage(请打开控制台看日志) 原文日期: 2010年09月0 ...

  10. [Asp.Net]Understanding Built-In User and Group Accounts in IIS

    昨天把程序IIS6迁移到IIS7,出现异常 解决办法:文件夹选项权限增加IIS_IUSER 资料来源: http://www.iis.net/learn/get-started/planning-fo ...