html in einem Iframe setzen (mit Hilfe von JavaScript)

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

Frage

Kann ich einen leeren iframe als Platzhalter erstellen, um später HTML einfügen in das?

Mit anderen Worten, ich nehme eine leere iframe mit einer ID,

Wie füge ich html es?

Ich bin mit jQuery, wenn das macht es einfacher.

War es hilfreich?

Lösung

Sie können es ohne jQuery tun auch: 

var iframe = document.getElementById('iframeID');
iframe = iframe.contentWindow || ( iframe.contentDocument.document || iframe.contentDocument);

iframe.document.open();
iframe.document.write('Hello World!');
iframe.document.close();

jQuery html Streifen Körper, html und Kopf-Tags aus dem eingefügten HTML.

Andere Tipps

Sehen Sie sich die Quelle dieser Seite: http://mg.to/test/dynaframe.html Es scheint genau das zu tun, was Sie tun wollen. 

$(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 );
});

Nein, es ist nicht. Sie würden das Skript wie folgt ändern: 

$(function() {
    var $frame = $('iframe');
    setTimeout( function() {
            var doc = $frame[0].contentWindow.document;
            var $body = $('body',doc);
            $body.html('<h1>Test</h1>');
    }, 1 );
});

iframeElementContainer =   document.getElementById('BOX_IFRAME').contentDocument;
iframeElementContainer.open();
iframeElementContainer.writeln("<html><body>hello</body></html>");
iframeElementContainer.close();

Ja, ich weiß, das ist möglich, aber das Hauptproblem ist, dass wir nicht einen Rahmen verarbeiten können von außen es i hat bereits eine andere Sache geladen. 

$(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 );
});

aber wenn wir beginnen, wie 

<iframe src="http:/www.hamrobrt.com">
<---Your Script to put as you like--->

Dann ist es unmöglich zu schlagen, dass aus.

  

Ich gleiches Problem habe, wo ich HTML-Code-Schnipsel in iframe dynamisch aus der Datenbank ohne SRC-Attribut von iframe und I fixed gleiches Problem mit folgendem Code

zeigen muß      

Ich hoffe, das jemand helfen würde, die gleiche Anforderung hat ich hatte.

jsfiddle Beispiel hier

HTML: 

<iframe src="" frameborder="0" class="iframe"></iframe>
<iframe src="" frameborder="0" class="iframe"></iframe>
<iframe src="" frameborder="0" class="iframe"></iframe>
<iframe src="" frameborder="0" class="iframe"></iframe>

JS 

<script>
var doc,$body;
var txt = Array(
            '<style>body{background-color:grey} h1{background-color:red;font-weight:900}</style><h1>Cool!!! this is text for</h1><p>First Iframe</p>',
            '<style>body{background-color:pink}h1{background-color:green;font-weight:200}</style><h1>Cool This is Text for</h1><p> second Iframe',
            '<style>body{background-color:yellow}h1{font-weight:400}</style><h1>Cool..... This is text FOR : </h1> <div>3rd Iframe</div>',
            '<style>body{background-color:blue} h1{font-weight:400}</style><h1>Cool This is text for Fourth iframe</h1>'
            );
$('.iframe').each(function(index,value){
    doc = $('iframe')[index].contentWindow.document;
        $body = $('body',doc);
        $body.html(txt[index]);
});
</script>
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top