postMessage All In One
Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('
') does not match the recipient window's origin (' ').
// 防抖
// const debounce = (func, times = 1000) => {
// let timer = null;
// return () => {
// if (timer){
// clearTimeout(timer);
// }
// timer = setTimeout(fn, wait);
// };
// };
// function debounce (func, times = 1000) {
// let timer = null;
// return function () {
// if (timer){
// clearTimeout(timer);
// }
// timer = setTimeout(fn, wait);
// };
// };
const sendScrollMessage = () => {
const app = document.querySelector(`[id="app"]`);
const height = Math.abs(app.scrollTop);
console.log('app, height', app, app.scrollTop, height);
parent.postMessage({
type: "iframeScrollEvent",
other: "other data to pass",
height: height,
}, "http://localhost:52331/test/heatmap/index.html");
};
setTimeout(() => {
function debounce (func, times = 1000) {
let timer = null;
return function () {
if (timer){
clearTimeout(timer);
}
timer = setTimeout(func, times);
};
};
const section = document.querySelector('section');
console.log('section =', section);
section.addEventListener('scroll', (event) => {
// console.log('iframe scroll', event);
debounce(sendScrollMessage, 500)();
}, false);
}, 1000);
demo
https://iframe.xgqfrms.xyz/post-message/index.html
refs
https://cdn.xgqfrms.xyz/iframe/post-message/child.html
https://cdn.xgqfrms.xyz/iframe/post-message/index.html
https://www.cnblogs.com/xgqfrms/p/10315391.html
©xgqfrms 2012-2020
www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！
原创文章，版权所有©️xgqfrms, 禁止转载 ️，侵权必究⚠️！