How to insert html in iframe

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

  •  03-10-2019
  •  | 
  •  

Question

Hallo all: I need to insert a html string in a iframe as shown below:

....

var html = "<html><head><title>Titolo</title></head><body><p>body</p></body></html>"

jQuery('#popolaIframe').click(function() {
  parent.$("#indexIframe")[0].documentElement.innerHTML = html;     
});

Is there a way to achieve this?

Was it helpful?

Solution 

var html = "<html><head><title>Titolo</title></head><body><p>body</p></body></html>"

jQuery('#popolaIframe').click(function() {
  var doc = parent.$("#indexIframe")[0].documentElement;
  doc.open();
  doc.write(html);
  doc.close();     
});

OTHER TIPS

Does that code you posted work? If not, it's probably because browsers disallow modification of iframe content for security reasons.

Looks like you can get a refrence to the body so I don't see why not:

http://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_iframe_contentdocument

You have lost 1 level, you need modify innerHtml of body, but not document:

document.body.innerHTML = bla-bla

You cannot insert into an iframe unless you remove() the iframe and use 'append(html)'. You can insert it inside iframes body like

$('body',parent.$("#indexIframe")[0].contentWindow.document).html(html)

Alternitevely if not sure about the parent element you could do that:

var doc = $.find("#myIframe")[0].contentWindow.document; //that will look in the whole dom though
doc.open();
doc.write(html);

At least this did the job in my case :)

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top