JSFiddle - React, Tailwind, and code Playground

by no2don

HTML

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
   <iframe src="https://localhost:44344/meditorfull" frameBorder="0" style="width:100%;height:100px" id="codeMain"></iframe>

    <button type="button" id="btnA">
        test1
    </button>
    <button type="button" id="btnB">
        test2
    </button>

JavaScript

var iframeObj=document.getElementById("codeMain").contentWindow;
      


        $('#btnA').click(function () {
        alert(iframeObj.GetContent());
            var data = {};
            data.SourceType = 'DMIXEDITOR';
            data.Content = 'HELLO';
            data.Func = 'FUNCA';
            iframeObj.postMessage(data, '*');

        });

        $('#btnB').click(function () {
            var data = {};
            data.SourceType = 'DMIXEDITOR';
            data.Content =2;
            data.Func = 'FUNCB';
            document.getElementById("codeMain").contentWindow.postMessage(data, '*');

        });


        function receiveMessage(e) {

            if (!e.data.hasOwnProperty('SourceType')) {

            } else {

                if (e.data.SourceType == 'DMIXEDITOR') {
                    alert(JSON.stringify(e.data));
                }

            }
        }

        // 監聽 message 事件
        window.addEventListener('message', receiveMessage, false);