locrizak locrizak - 11 months ago 57
jQuery Question

Triggering a jQuery event from iframe

Here's the scenario, I have events happening from within an iframe and up until now everything is working well. I just ran into the problem where I want to dispatch an event from the iframe to the parent.

I'm using this to trigger the event from the iframe:

$('body', window.parent.document).trigger('eventName');
//and I've also tried

And then in the parent page I've listening for the event like this:

$('body').bind('eventName', myFunction)

I know the script gets to the trigger because I stuck a
before and after the trigger. The iframe is on the same domain so there is no problem there.

I can call a function on the parent page directly like this:
but I was wondering if this is possible with using using an event based solution.


@cwolves answer is working great:

parent.$('body').trigger( 'eventName' );

Answer Source

If you have jQuery loaded in the parent frame, try:

parent.$('body').trigger( 'eventName' );

If not, try this, I'm not sure if it will work but I just looked at the jQuery source and think it may:

var pBody = $( parent.document.body );
pBody.trigger( 'eventName', pBody.data() );

(And do the same thing when binding eventName) The issue, as far as I can tell, is that jQuery is using the data from the local page, which is causing issues because it looks like it's trying to load data from the other frame. In other words, it's a mess, but there are data params accepted in .bind, .trigger, etc.