最稳路径是父页在layer.open的success回调或之前将接收函数挂到window全局,子页确认parent.receiveData存在后调用传对象。
不能靠 url 拼接 json.stringify 后的长字符串,ie 和部分 webview 会截断;也不能依赖 layer.getchildframe 主动读子页变量——它拿不到 js 上下文里的局部对象,且时机不可控。最稳路径只有一条:父页挂接收函数,子页调用传对象。
父页怎么安全暴露接收入口
必须在 layer.open 的 success 回调里,或在其之前,把函数挂到 window(即全局)上:
window.receiveData = function(data) { if (!data || typeof data !== 'object') return; console.log('收到:', data); }- 别写在
$(document).ready或模块闭包里,否则子页访问parent.receiveData会报undefined - 函数名要和子页调用时一致,大小写敏感
- 不建议用
parent.layer.close的回调参数传数据——它根本不接收子页输入,只是关闭触发事件
子页怎么传复杂 JSON 对象
子页不能等 DOM 加载完就立刻调用,得先确认父函数已就绪:
- 用
setTimeout或轮询检查:if (typeof parent.receiveData === 'function')再执行 - 打包成对象传,别拆成多个参数:
parent.receiveData({ id: 123, name: '张三', tags: ['a', 'b'] }) - 调用后立即关弹层:
parent.layer.close(parent.layer.getFrameIndex(window.name)) - 中文、嵌套数组、布尔值、
null都能直传,无编码/解码开销
为什么不用 postMessage 或 getChildFrame
postMessage 看似通用,但实际踩坑多:
- 跨域时必须校验
event.origin,漏判会引入 XSS 风险 - 父页监听
message事件需手动过滤来源,否则可能收到来自其他 iframe 的干扰消息 -
layer.getChildFrame返回的是iframe.contentWindow.document,不是子页 JS 执行环境,var data = {...}这类变量根本取不到 - 子页若用了
layui.use异步加载模块,getChildFrame取 DOM 后再找 JS 变量,大概率是undefined
真正复杂的地方不在传参本身,而在于父子页 JS 执行时机差——子页脚本可能比父页 success 回调还早跑完,所以挂函数必须“提前且全局”,调用必须“存在性判断+延迟保险”。


















