Enlace a eventos dentro de iframe creado dinámicamente

Question

Necesito enlazar a un evento (digamos click en un arbitrario <input>) dentro de un iframe que se crea dinámicamente después de que el usuario realiza una determinada acción. El código que agrega el iframe Y el código dentro del iframe no es mío y no puedo cambiarlo de ninguna manera (este es un panel de administración de CMS).

¿Cómo puedo escuchar los eventos usando jQuery 1.6 (de nuevo, esta no es mi elección, estoy atascado). Pensé delegate() podría ser lo que quiero:

$('body').delegate('iframe input', 'click', function(e) { 
    alert('bingo?'); 
}); 

Pero lo anterior no alerta cuando se hace clic en una entrada. A continuación, sin embargo, funciona como se esperaba:

$('body').delegate('input', 'click', function(e) { 
    alert('bingo?'); 
}); 

Pero esto está fuera del iframe.

Los src de iframe apunta al mismo dominio, obviamente.

Cualquier ayuda o simplemente un golpe en la dirección correcta es muy apreciada.

Answer 1

'iframe input' no selecciona input elementos dentro de iframe.

Puede enlazar el evento como

$('body iframe').contents().find('input').bind('click',function(e) { 
    alert('bingo?'); 
}); 

Creo que también se puede usar algo como

$('body iframe').contents().find('body').delegate('input','click',function(e) { 
    alert('bingo?'); 
}); 

Para detectar si el marco flotante ha sido completamente cargado, utilice el método descrito en esta respuesta https://stackoverflow.com/a/5788723/344304

Agregar En el documento principal/principal:

function iframeLoaded() { 
    $('body iframe').contents().find('input').bind('click',function(e) { 
     alert('bingo?'); 
    }); 
} 

Añadir En el documento marco flotante:

window.onload = function() { 
    parent.iframeLoaded(); 
} 

O utilice

$('body iframe').load(function(){ 
    $('body iframe').contents().find('input').bind('click',function(e) { 
      alert('bingo?'); 
     }); 
});