post方式加载iframe

最近开发遇到一个问题,数据库某个字段里面存着整个html代码。需求是预览的时候需要可视化,将html直接展示到页面。

那么问题来了:

1、需要展示的html中的样式会与外面的页面冲突。

2、直接加载数据中的html,可能存着一些脚本错误。

首先想到的解决办法是用iframe,但是iframe是直接加载某个页面。

想到的方法是:

iframe加载一个空页面,将HTML代码直接填充到空页面,然后显示。

这种方式可以成功。然而因为某些原因html代码不能再次从数据库读取,html代码参数需要传递,然而iframe的src加载是get请求,get请求的参数大小有限制,所以只能用post.

这里需要用form表单的post请求,只需将form的target与iframe的name保持一致:

html代码:

<form id="myForm" method="post" target="myFrame">
<input type="hidden" name="datas" id="data_param" />
 </form>
<iframe name="myFrame" width="500px" height="200px;"  ></iframe>
$("#data_param").val(dp);
$("#myForm").attr("action", "/java/loadHtmlData");
$("#myForm").submit();

python代码:

def loadHtmlData(request):
    datas = request.POST.get(‘datas‘)
    return render(request, "crawler_result_iframe.html", {
        "datas": datas
  })
crawler_result_iframe.html为空白html

因此这里只需要将form的target属性的值与frame的name保持一致,即可实现iframe的post方式加载数据。

时间: 2024-08-04 07:38:52

post方式加载iframe的相关文章

解决父页面加载iframe时,src链接中参数值过大导致加载失败的问题

有时候我们在使用iframe时,喜欢这么写 <iframe src="*******.do?param=****" id="leftFrame" name="leftFrame" frameborder="0"></iframe> 或者是使用js加载src: var params = "?pk_id="+pk_id; var frameLeftSrc = "<%=pa

能否使用require(&#39;.json&#39;)的方式加载大量JSON文件?

Node.js中推崇非阻塞I/O,但是require一个模块时却是同步调用的,这会带来性能上的开销,但并不是每次require都很耗时,因为在require成功之后会缓存起来,在此加载时直接从缓存读取,并没有额外开销. 当通过.json的方式加载文件时,固然方便,但大量使用时会导致这些数据被缓存.大量数据会驻留在内存中,导致GC频繁和内存泄漏. 摘自:<技术之瞳> 能否使用require('.json')的方式加载大量JSON文件?

页面第一次加载实现图片淡入方式加载

页面第一次加载实现图片淡入方式加载:图片以淡入方式加载总是让人感觉有一种动态的感觉,可以让用户体验更好,下面就简单介绍一下如何实现此效果.当页面加载的时候,让加载好的图片先隐藏,然后再使用fadeIn()函数实现图片的淡入效果,参考代码如下: <script type="text/javascript"> $("#load img").load(function() { $(this).hide(); $(this).fadeIn("5000&

JQuery 动态加载iframe.

html: <iframe id="ifm" style="width:inherit;height:inherit" runat="server" ></iframe> <li data-options="iconCls:'icon-search'"> <a href="javascript:void(0)" onclick="showdata()&qu

Unity两中方式加载图片

看到草羊发的图片,也是真懒. 想起来当时写天气预报现在都忘干净了,好记性不如烂笔头,还是应该多记.自己打下来好了 using System; using System.Collections; using System.Collections.Generic; using UnityEngine; using UnityEngine.UI; using System.IO; public class readPictures : MonoBehaviour { private Image ima

java基础-jdbc——三种方式加载驱动建立连接

1 String url = "jdbc:mysql://localhost:3306/student?Unicode=true&characterEncoding=utf-8"; 2 Properties info = new Properties(); 3 info.put("user", "canon"); 4 info.put("password", "123456"); 5 6 /** 7

动态链接库知识点总结之三(如何以显示的方式加载DLL)

总结一下如何显示加载方式加载DLL, 首先,我们新建一个win32项目,选择dll,空项目,再添加一个源文件,一个模块定义文件(.def),具体如下图.(详细方法已经在前两篇文章中讲述,如有不懂,打开链接查看) (1)    新建项目,名称为:dll,添加一个源文件(.cpp),编代码,编译文件 . (2)    为项目添加一个模块定义文件(上一篇文章中详细介绍)(先新建一个文本,再改属性名),编辑代码,如下图 (3)    新建一个DLL测试应用程序(基于对话框的),项目名字:TestDLL,

js 滚动加载iframe框中内容

var isIE6 = !!window.ActiveXObject&&!window.XMLHttpRequest; //滚动加载 var scrollLoad =function(){ $("#content iframe[_src]").each(function(){ var t = $(this); if( t.offset().top<= $(document).scrollTop() + $(window).height() ) { t.attr(

DevExpress GridControl 使用瀑布加载方式加载数据

从事winform开发已经快三年了,这三年中两年使用DevExpress控件进行winform系统开发,对Dev控件有自己的一些思考,下面就常用的表格控件GridControl的分页进行一些讨论. 在平时的系统开发中,对不对C/S系统中的列表进行分页,我和同事也有不一样的见解.同事认为C/S中Grid不必分页,因为分页会对数据的查看带来不便,但是又会遇到数据量较大,传输的压力,他倾向于使用查询条件来约束查询返回的数据量.我们的系统一开始也的确是这么实现的.不进行任何分页处理,一次查询出所有满足条