从数据库中存储的HTML渲染iframe
我有一个用Django渲染的HTML模板。我传入了所有必要的上下文变量——my_heading
是标题,my_html
是经过安全处理的HTML。我想在iframe中显示my_html
。
<html>
<head>
<title>Iframe Example</title>
</head>
<body>
<p>{% my_heading %}</p>
<iframe name="iframe1" width="600" height="400" src="http://www.yahoo.com" frameborder="yes" scrolling="yes"></iframe>
</body>
</html>
你知道怎么做吗?我找到的所有例子都是让iframe指向一个网址。我对HTML和JS真是一窍不通。:|
谢谢
3 个回答
3
Michael Klocker没有直接回答你的问题,但他给出的答案其实是个更好的解决方案。你应该考虑采用他的建议。
不过,来回答你的问题:你只能给IFrame传一个网址,所以如果你真的想用IFrame,就需要在Django里设置一个新的网址和视图,来返回my_html作为响应。也就是说,会发生两个HTTP请求:一个是请求包含IFrame的页面,另一个是请求IFrame里的内容。
3
如果我理解得没错,你是想在Django模板中动态显示用Python准备的HTML内容,对吧?如果是这样的话,你其实不需要用到Iframe。Iframe只有在你想把其他网页的某部分嵌入到你自己网页的某个区域时才需要用到。下面是一个示例:
<html>
<head>
<title>Iframe Example</title>
</head>
<body>
<p>{% my_heading %}</p>
<div id="content">{% my_html %}</div>
</body>
</html>
在上面的代码基础上,根据下面的评论,听起来你是想用Iframe显示一个完整的页面,而这个页面来自你网站上的另一个视图或网址。那么你可以使用:
<html>
<head>
<title>Iframe Example</title>
</head>
<body>
<p>{% my_heading %}</p>
<iframe src="URL_TO_MY_2ND_VIEW_IN_DJANGO" width="100%" height="300"></iframe>
</body>
</html>
0
我用了一种小技巧来实现这个功能。首先,有一个隐藏的div,里面放着HTML内容。然后,IFrame没有指向任何地址,因为我不想遇到跨域问题。接着,我把我的HTML内容注入到这个IFrame里。
<html>
<head>
<title>Iframe Example</title>
</head>
<body>
<p>{% my_heading %}</p>
<iframe name="iframe2" id="iframe2" width="0" height="0" src="" style="border:0px; overflow-x:hidden;"></iframe>
<div id="page" style="display:none" >{{ my_html }}</div>
<script type="text/javascript">
function getWindow(iframe) {
return (iframe.contentWindow) ? iframe.contentWindow : (iframe.contentDocument.document) ? iframe.contentDocument.document : iframe.contentDocument;
}
getWindow(document.getElementById('iframe2')).document.open();
getWindow(document.getElementById('iframe2')).document.write(document.getElementById('page').innerHTML);
getWindow(document.getElementById('iframe2')).document.close();
document.getElementById('iframe2').style.height = (getWindow(document.getElementById('iframe2')).document.body.scrollHeight + 20) +"px";
document.getElementById('iframe2').style.width = (document.getElementById('iframe2').parentNode.offsetWidth) +"px";
</script>
</body>
</html>