Dado un iframe con <span class="fineme"> en todo el iframe ...JQUERY, Agregar un oyente de eventos a elementos en un iFrame?
¿Es posible añadir un detector de eventos con jQuery para desencadenar una ALERTA cualquier momento el usuario mueve el ratón sobre .fineme en el marco flotante, desde la ventana superior/padre ?
Consulte http://api.jquery.com/contents/ para acceder al documento de contenido de un iframe.
Una solución a su pregunta podría ser:
$("iframe#name").contents().find(".fineme").bind("mouseover", function() { alert("Found me"); });
Sí, parece que por defecto si se ejecuta un selector de la ventana padre no va a encontrar elementos dentro del marco flotante. Sin embargo, puede asignar explícitamente a jQuery el contexto para mirar dentro del iframe.
Una forma de hacer esto sería:
var iframe = $("#someIframeId");
$(".fineme",iframe.get(0).contentDocument).mouseover(function(){alert('hi')});
NOTA: esto sólo funcionará si tanto el sitio principal y el IFrame están en el mismo dominio. Para obtener más información al respecto, consulte: http://madskristensen.net/post/Iframe-cross-domain-JavaScript-calls.aspx
Interesante, pero eso no parece funcionar? – AnApprentice
Una cosa a tener en cuenta: para que esto funcione, su iframe debe estar en el mismo dominio que su página. Si están en dominios diferentes, creo que la seguridad del navegador impide que funcione. –
Esto funciona bien para jQuery nativo, pero ¿qué pasa con los objetos de jQuery UI? Por ejemplo, si llama el tamaño del elemento, no tendrá el contexto del mouse. Tienes que hacer clic en los controles redimensionables y arrastrar el mouse fuera del iframe para que responda a los movimientos del mouse. – naivedeveloper
Tuve un problema similar y encontré una solución que me funciona. Prueba esto:
document.getElementById('iframe_id').contentWindow.$('.fineme').on(...)
Funciona para cualquier función de jQuery, pero escucha los eventos en el DOM de jQuery de marco flotante.
Interesante, ¿pero eso tampoco parece funcionar? – AnApprentice
Funciona para mí. ¿Tal vez la clase debería ser '.findme' en lugar de' .fineme'? –
Es posible que deba envolver esto en un cheque para asegurarse de que el iframe se haya cargado. Si intenta acceder al contenido antes de que se haya cargado el iframe, no podrá encontrarlo. Envuélvalo en $ ("iframe # nombre"). Load(). – naivedeveloper