Как закрыть Iframe, используя сообщение Paremt в JavaScript - PullRequest
Новая
       13

Как закрыть Iframe, используя сообщение Paremt в JavaScript

0 голосов
/ 03 апреля 2019

У меня есть простой блок, который содержит iframe, я бы хотел, чтобы пользователь мог закрыть iframe с помощью кнопки.

Вот что у меня есть

JS

UPDATE 

  document.querySelector(DOM.videoclosebtn).addEventListener('click', closeIframeContainer);
    var closeIframeContainer =function(){
        window.parent.postMessage("event=closeiframe", "*");
    };

    window.addEventListener("message", receiveMessageFromIframe, false);
    function receiveMessageFromIframe(msg) {
        if (event == "closeiframe") {
            document.getElementById('iframe-container').remove();
        }else{
           alert('hehehe');
        }
    }

Вот index.html с iframe 

<div id="iframe-container">

            <iframe src="/videoexplainer/data.html" style="border:none"></iframe>
    </div>

Вот data.html 

 <div id="video-close_btn" class="video-btn">
                    <img src="images/x.png" />
                </div>

Ошибка: 

Uncaught TypeError: Cannot read property 'window' of null
    at HTMLDivElement.closeIframeContainer (videoexplainer.js:123)

к сожалению, это не работает, что мне нужно сделать, чтобы получить то, что я хочу?

1 Ответ

0 голосов
/ 03 апреля 2019

Ваш код назначает возвращаемое значение из вызова .postMessage() для getIFrameID, но затем вы ожидаете использовать его в качестве ссылки на узел DOM. 

var closeIframeContainer = function(){
   var getIframeID = document.getElementById('iframe-container');
   getIframeID.parent.postMessage("*");
   getIframeID.style.display="none";
};

Сначала получите ссылку на узел элемента, а затем выполните другие операции.

...