Передача сообщений из iFrame во всех браузерах
У меня есть встроенный iframe, который будет использоваться на сторонних сайтах. Он имеет несколько форм для заполнения и в конце должен сообщить родительской странице, что это сделано.
Другими словами, iframe должен передать сообщение родительскому при нажатии кнопки.
После прохождения через океаны "Нет, междоменная политика - это придурка", я нашел window.postMessage, часть спецификации HTML5.
В принципе, вы размещаете на своей странице следующий JavaScript на странице, чтобы захватить сообщение из iframe:
window.addEventListener('message', goToThing, false);
function goToThing(event) {
//check the origin, to make sure it comes from a trusted source.
if(event.origin !== 'http://localhost')
return;
//the event.data should be the id, a number.
//if it is, got to the page, using the id.
if(!isNaN(event.data))
window.location.href = 'http://localhost/somepage/' + event.data;
}
Затем в iframe есть JavaScript, который отправляет сообщение родительскому объекту:
$('form').submit(function(){
parent.postMessage(someId, '*');
});
Удивительно, правда? Проблема только в том, что она не работает в любой версии IE. Итак, мой вопрос заключается в следующем: Учитывая, что мне нужно передать сообщение из iframe к нему parent (оба из которых я контролирую), есть метод, который я могу использовать, который будет работать через любой ( > IE6) браузер?
Ответы
Ответ 1
Основная работа, которую я видел, включает в себя установку значения хэша в родительском окне и определение значения хэша в родительском элементе, разбор хэш-значения для получения данных и выполнение всех необходимых действий. Вот один пример этого: http://www.onlineaspect.com/2010/01/15/backwards-compatible-postmessage/. Есть больше вариантов через Google, как этот: http://easyxdm.net/wp/.
Ответ 2
В IE вы должны использовать
attachEvent("onmessage", postMessageListener, false);
вместо
addEventListener("message", postMessageListener, false);
Ответ 3
Это проще, чем это.
Вы говорите, что вы контролируете как родителя, так и содержимое фрейма, которое вы можете настроить двумя способами
связь в javascript.
Все, что вам нужно, это
yourframename.document.getElementById('idofsomethinginttheframe')
И затем изнутри фреймового адреса ничего вне его
parent.document