码迷,mamicode.com
首页 > 其他好文 > 详细

iframe 父子互传消息

时间:2018-11-23 15:17:14      阅读:165      评论:0      收藏:0      [点我收藏+]

标签:date   frame   win   iframe   list   data   time   back   lis   

https://blog.csdn.net/qq_38366657/article/details/81538145

 

 

// 父页面的js
<iframe id=‘TopHeader‘ src="XXX"></iframe> $(window).scroll(function () { var scrollTop = $(window).scrollTop() console.log(scrollTop, ‘1111‘); if (scrollTop > 600) { // $("#TopHeader").attr(‘data-hh‘, ‘ok‘) // 父向子发送消息 var message = scrollTop;// ‘Hello! The time is: ‘ + (new Date().getTime()) + "父的滚动" + scrollTop; // console.log(‘blog.local: sending message: ‘ + message); //send the message and target URI iframe.postMessage(message, domain); } }); //弹出一个新窗口 var domain = location.origin; var iframe = document.getElementById(‘TopHeader‘).contentWindow; //响应事件 window.addEventListener(‘message‘, function (event) { // if(event.origin !== ‘http://davidwalsh.name‘) return; console.log(‘index22222222222: ‘ + event.data); // event.source.postMessage(‘holla back youngin!‘,event.origin); }, false); // 子页面的js //响应事件 window.addEventListener(‘message‘, function (event) { //if(event.origin !== ‘http://localhost:11893‘) return; console.log(‘message lister6666666666: ‘ + event.data, event); event.source.postMessage(‘holla back youngin!6666666666‘, event.origin); parent.$("#TopHeader").css("height", event.data+‘px‘); }, false);

  

iframe 父子互传消息

标签:date   frame   win   iframe   list   data   time   back   lis   

原文地址:https://www.cnblogs.com/holy-amy/p/10007482.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!