Ошибка: Неперехваченная ошибка типа: Не удается прочитать свойство ‘window’ с нулевым значением в HTMLDivElement.closeIframeContainer

#javascript #jquery #html #iframe #postmessage

#javascript #jquery #HTML #элемент iframe #postmessage #iframe

Вопрос:

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

Вот что у меня есть на данный момент

JS

   document.querySelector(.video-close_btn).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>
  

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

Комментарии:

1. Вам нужно присвоить closeIframeContainer , прежде чем использовать его в качестве аргумента для addEventListener .

2. Вы уверены, что это реальный код? Вы никогда не используете window в качестве имени свойства. Сообщение об ошибке жалуется на something.window , где something == null .

3. И closeIframeContainer является функцией верхнего уровня, это не свойство HTMLDivElement .