Присоединить событие в дочернем iframe к обработчику в родительском окне

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

У меня есть iframe, сгенерированный JS:

<iframe name="temp_iframe" width="100%" height="95%" src="'+the_url+'"></iframe>

И внутри кнопка отправки и кнопка отмены. Кнопка отправки работает отлично, но я хочу, чтобы кнопка отмены закрыла этот модальный, содержащий iframe... Я также хочу, чтобы кнопка отправки отправила, а затем закрыла модальную. Обычно это было бы легко, но я не уверен, как настроить событие в родительском окне на дочерний элемент DOM iframe, который влияет на родительский элемент child, в главном окне.

например. если это не было в iframe и в jQuery:

$('[name=temp_iframe] button').live('click',function(){
    alert('click');
    return false;
});

EDIT: А также, он в том же домене!

Ответ 1

Используйте contents() для доступа к объекту Document внутри iframe. Обратите внимание, что в общем случае проблемы с использованием библиотеки jQuery в одном документе для управления другим документом, и этого, как правило, следует избегать. Однако в случае связанных событий он работает.

$('[name=temp_iframe]').contents().find('button').click(function() {
    alert('click');
});

Для этого требуется, чтобы загружался iframe и его содержимое, поэтому при необходимости обработчик $(window).load(). Вы не можете live/delegate через документы, так как события не распространяются из дочернего документа в его родитель.

Ответ 2

В простом JavaScript это будет:

document.getElementById("frameId").contentDocument.getElementById("buttonId").click();

Если вам нужно искать элементы по значению атрибута и имени тега, вы можете:

document.querySelectorAll('[name=temp_iframe]')[0].contentDocument.getElementsByTagName('button')[0].click();