iframe之间的postMessage传参

最新推荐文章于 2025-04-20 18:42:10 发布

转载最新推荐文章于 2025-04-20 18:42:10 发布 · 810 阅读

1 ·

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/sanqianjin/p/10767470.html

文章标签：

#javascript #ViewUI

本文深入讲解了使用JavaScript进行IFrame间通信的方法，包括如何通过postMessage传递参数以及如何监听并处理来自子窗口或父窗口的消息。文章提供了具体的代码示例，展示了如何实现IFrame关闭和删除习题功能。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、传参

    function IframeClose() {
        var obj = {method: "iframeClose"};
        window.parent.postMessage(obj, "*");
    }


    //删除
    function deleteExercise(exeid) {
        //删除习题：delExercise(习题id)
        var obj = {method: "deleteExercise", exeid: exeid};
        window.frames[0].postMessage(obj, domain);
    }

2、接参

    window.addEventListener('message', function (e) {
        if (e.data.method == "iframeClose") {
            Modal.Close("#ExerciseScoreIframe");
            if (typeof iframecallback == "function") {
                iframecallback();
            } else {
                window.location.reload();
            }
        }
    }, false);


    window.addEventListener('message', function (e) {
         if (e.data.removeLayout != undefined && e.data.removeLayout == "success") {
               console.log("删除排版成功");
               window.location.reload();
            }
   }, false);