Forcer n'importe quel HREF dans un IFrame à utiliser son parent comme cible

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

Question

J'utilise actuellement un IFrame pour mettre en sandbox le contenu généré par l'utilisateur sur un site Web.Cela élimine tout problème de style avec nos feuilles de style principales.

Cependant, lorsqu'un utilisateur génère un lien à l'aide de notre éditeur de texte enrichi, nous souhaitons que le lien s'ouvre dans le parent et pas seulement dans l'IFrame.Je me rends compte que vous pouvez définir une cible pour le parent, mais nous n'avons aucun contrôle sur l'utilisateur et sur ce qu'il entre dans son contenu.

Existe-t-il un moyen de détourner les HREF à l'intérieur de l'IFrame afin qu'ils ciblent tous les parents sans les modifier ?Ou utiliser un peu de Javascript qui pourrait être injecté universellement afin que je n'aie pas besoin de parcourir tout le contenu et de remplacer la cible par programme ?

Idéalement, un simple script en un seul endroit serait la meilleure solution.

Pensées?

SOLUTION FINALE

J'ai utilisé une variante de la réponse que j'ai sélectionnée...Cela m’a mis dans la bonne direction.

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

C'est à l'intérieur de l'IFrame avec le contenu.Cela s’est avéré être la solution la plus simple pour cette tâche.

Était-ce utile?

La solution

Utilisez ceci pour le créer et vous aurez accès à toutes les parties avec 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 ); 
    });

Donc tu peux faire quelque chose comme ça

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

Trouvé ici : http://groups.google.com/group/jquery-en/browse_thread/thread/fb646741a6192540

Autres conseils

Même domaine dans l'iframe ?Oui.

<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>

Domaine différent dans l'iframe ?Non.

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

renvoie une « Autorisation refusée pour obtenir la propriété HTMLDocument.getElementsByTagName ».

Il existe peut-être des solutions, mais au moins avec un simple JavaScript, il existe des protections contre les iframes qui gâchent les sites (imaginez un cadre malveillant autour du site Web d'une banque et vous pouvez comprendre pourquoi).

J'ai contourné le problème inter-domaines via 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>

Comme le cadre parent n'est pas accessible, j'ai remplacé le corps via ajax.

Réponse la plus simple :

<head>
    <base target="_blank">
</head>
Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top