postMessage() генерирует ошибку «undefined не является функцией»

Question

Я пытаюсь получить postMessage(), чтобы работать для связи между iframe и моим основным веб-сайтом. Однако, используя точный синтаксис, приведенный в example code на MDN, я получаю приятную ошибку Undefined is not a function. Я пробовал несколько вещей, таких как инициализация iframe внутри Javascript и добавление его на мою страницу, но это оставило меня с той же ошибкой. То же самое для отдельных селекторов, чтобы выбрать мой iframe.

У меня есть следующий Javascript код:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $('.editor').postMessage("A", "domain here"); 
    }); 

    function receiveMessage(event) 
    { 
     if (event.origin !== "domain here") 
      return; 

     // Do something 
    } 

    window.addEventListener("message", receiveMessage, false); 
</script> 

Сценарий выше пытается отправить сообщение на мой IFRAME на странице, которая выглядит как:

<iframe src="domain here/frameListener.html" class="editor"></iframe> 

Затем он имеет функцию receiveMessage чтобы поймать любые сообщения, отправляемые в качестве ответа на главную веб-страницу. И последнее, но не менее важное: я пробовал ответы, приведенные в this question: Но это не помогло решить мою проблему. Поэтому это не дубликат.

Как я могу избавиться от этого сообщения об ошибке?

Answer 1

postMessage не функция JQuery, так что вам нужно, чтобы получить фактический window DOM элемент и вызвать его на том, что:

$('.editor').get(0).contentWindow.postMessage("A", "domain here"); 

Кроме того, вы должны получить доступ к contentWindow свойство iframe. Вот выдержка из документации MDN:

otherWindow.postMessage(message, targetOrigin, [transfer]); 

otherWindow

ссылку на другое окно; такая ссылка может быть , полученная, например, с использованием свойства contentWindow элемента iframe , объекта, возвращаемого окном.open, или с помощью имени или числового индекса на window.frames.