Forzar a cualquier HREF en un IFrame a usar su padre como objetivo

StackOverflow https://stackoverflow.com/questions/1225245

Pregunta

Actualmente estoy usando un IFrame para proteger el contenido generado por el usuario en un sitio web.Esto elimina cualquier problema de estilo con nuestras hojas de estilo principales.

Sin embargo, cuando un usuario genera un enlace utilizando nuestro editor de texto enriquecido, nos gustaría que el enlace se abra en el elemento principal y no solo en el IFrame.Me doy cuenta de que puedes establecer un objetivo para los padres, pero no tenemos control sobre el usuario ni sobre lo que ingresa en su contenido.

¿Hay alguna manera de secuestrar los HREF dentro del IFrame para que todos apunten a los padres sin modificarlos?¿O usar un poco de Javascript que podría inyectarse universalmente para no tener que revisar todo el contenido y reemplazar el objetivo mediante programación?

Idealmente, la mejor solución sería un guión simple en un solo lugar.

¿Pensamientos?

SOLUCIÓN FINAL

Utilicé una variación de la respuesta que seleccioné...Me llevó en la dirección correcta.

<script>
  Event.observe(window, 'load', function() {
    $$('a').each(function(e) {
      e.writeAttribute('target', '_parent');
    });
  });
</script>

Eso está dentro del IFrame con el contenido.Terminó siendo la solución más sencilla para la tarea.

¿Fue útil?

Solución

Use esto para crearlo y tendrá acceso a cualquier parte con la variable $body:

$(function() { 
        var $frame = $('<iframe style="width:200px; height:100px;">'); 
        $('body').html( $frame ); 
        setTimeout( function() { 
            var doc = $frame[0].contentWindow.document; 
            var $body = $('body',doc); 
            $body.html('<h1>Test</h1>'); 
        }, 1 ); 
    });

Entonces puedes hacer algo como esto.

$('a', $body).attr('target', '_parent');

Encontrado aquí: http://groups.google.com/group/jquery-en/browse_thread/thread/fb646741a6192540

Otros consejos

¿Mismo dominio en el iframe?Sí.

<script type="text/javascript">
function hijacklinks(iframe){
  var as = iframe.contentDocument.getElementsByTagName('a');
  for(i=0;i<as.length;i++){
    as[i].setAttribute('target','_parent');
  }
}
</script>

<iframe src="http://example.com/test.html" onload="hijacklinks(this)"></iframe>

¿Dominio diferente en el iframe?No.

<iframe src="http://www.google.com/search?q=google+happy" onload="hijacklinks(this)"></iframe>

produce un "Permiso denegado para obtener la propiedad HTMLDocument.getElementsByTagName".

Puede haber formas de evitarlo, pero al menos con JavaScript simple hay algunas protecciones contra los iframes que interfieren con los sitios (imagine un marco malicioso alrededor del sitio web de un banco y podrá entender por qué).

Solucioné el problema entre dominios a través de ajax.

function runAjaxDone(response) {
            $('body').html(response);
        }
        function callAjax(url) {
            $.ajax({ url: url + '&r=' + Math.random(), success: runAjaxDone });
            return false;
        }

<a runat="server" href="#"
                        onclick='<%# "callAjax(\"http://partners.thevoiceinternet.com/portal/Customer/Report/AgentReport.aspx?AgentID="+Eval("AgentID").ToString()+"&name="+Server.UrlEncode(Eval("SubAgentName").ToString())+"\"); return false;" %>'>
                        <asp:Label ID="lbl" runat="server" Text='<%# Eval("SubAgentName") %>'></asp:Label></a>

Como no se puede acceder al marco principal, reemplacé el cuerpo mediante ajax.

Respuesta más simple:

<head>
    <base target="_blank">
</head>
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top