jquery - How to show some HTML that was generated by Javascript -
here initial html, small. it's meant loading screen.
<html> <head> <title>simple hello world</title> <link href="rapid-ui.css" type="text/css" rel="stylesheet" /> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="rapid-ui.js"></script> </head> <body> body of page. </body> </html>
the "rapid-ui.js" generate html string, full document - including doctype, head, meta, scripts, css, etc. after done generating html should display html on top of page in iframe in same way if "src" of iframe set url generated same html string.
i tried this:
function showhtml(html) { var iframe = $('<iframe id="display" frameborder="0"></iframe>'); iframe[0].src = 'data:text/html;charset=utf-8,' + encodeuri(html); iframe.appendto('body'); }
it doesn't seem css or scripts executed properly.
this doesn't work either
function showhtml(html) { var iframe = $('<iframe id="display" frameborder="0"></iframe>'); iframe[0].innerhtml = html; iframe.appendto('body'); }
you cannot insert data iframe before appended dom. try this
function showhtml(html) { $('<iframe id="display" frameborder="0">').appendto('body') .contents().find('body').append(html); }
here way if need edit head.
function showhtml(html) { var iframe = $('<iframe id="display" frameborder="0">').appendto('body'); var doc = iframe[0].contentwindow.document; doc.open(); doc.write(html); doc.close(); }
Comments
Post a Comment