Trigger events in iframe's parent window

Question

Why is the following not working:

//iframe:
window.parent.$(document).trigger(\'complete\');

//parent window:
$(document).bind(\'complete\', function(){
  a         


        

Answer 1

Answering directly to OP's question: because there is a bug in the first code example.

You pass the iframe's document object to the parent's $ function. This does not make much sense.

1. Parent's jQuery instance can not trigger event on DOM object of other window;

2. Even if it could, it is an iframe's document, but you try to listen for the event on parent's document.

This would probably work:

window.parent.$(window.parent.document).trigger('complete');

Answer 2

You might try adding a triggering function in the parent document, then calling it as a regular function from the iframe. This should ensure you're triggering the event in the right document context.

// In Parent
function triggerComplete () {
  $(document).trigger('complete');
}

// In iFrame
window.parent.triggerComplete();

Answer 3

Check this solution, it's very tricky:

top.frames['frame_name'].document.getElementById('Processing').style.display = 'none'; 

Answer 4

The way events are tracked, you can only trigger or receive events on the same document.

try

window.parent.$(window.parent.document).trigger('complete');