flask 图文混排的简单操作
1、引入js 包
<script type="text/javascript" src="../../static/news/js/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="../../static/news/js/jquery.form.min.js"></script>
<script src="../../static/news/tinymce/js/tinymce/tinymce.min.js"></script>
<script src="../../static/news/js/tinymce_setup.js"></script>
2、使用
<form action="" method="post">
<input id="rich_content" name="content" value=" "/>
</form>
3、配置。
在tinymce_setup.js文件最下边的 imageupload_url:为图片上传对应的接口
imageupload_url: "/admin/submit-image"
4、图片上传接口
@admin_blue.route('/submit-image')
def submit_image():
# 获取文件 get('file') 为固定写法
img = request.files.get('file')
image_name = photos.save(img) # 将头像保存到 程序目录下
image_url = '/static/upload/' + image_name # 生成图片保存到地址
mes = {}
mes['path'] = image_url # key为固定值,不可随意修改
mes['error'] = False # key为固定值,不可随意修改
return jsonify(mes)
5、渲染页面。使用过滤器 safe
{{ data.content | safe}}
flask 图文混排的简单操作的更多相关文章
- 简单的Coretext 图文混排
在很多新闻类或有文字展示的应用中现在都会出现图文混排的界面例如网易新闻等,乍一看去相似一个网页,其实这样效果并非由UIWebView 加载网页实现.现在分享一种比较简单的实现方式 iOS sdk中为我 ...
- Word 2010之简单图文混排
所谓图文混排,就是指将图片与文本内容进行一定规律的排列,以让文档更加漂亮. 下面的示范是一个简单的将两副照片混排到文字当中的(图片与文本内容无关,仅供演示). 1. 打开Word,输入文本内容: 2. ...
- 图文混排--CoreText的简单运用
常见的在一些微博微信中可以看见一段文字中有不同的字体,字体有不同的颜色,并且可能会有一些笑脸之类的表情,这些可以通过图文混排做到. 图文混排可以通过WebView和CoreText做到,其他还有别的方 ...
- 用NSAttributedString实现简单的图文混排
iOS7以后,因为TextKit的强大,可以用NSAttributedString很方便的实现图文混排(主要是利用了NSTextAttachment). 关于Textkit的牛逼之处,可以参考objc ...
- 【iOS】使用CoreText实现图文混排
iOS没有现成的支持图文混排的控件,而要用多个基础控件组合拼成图文混排这样复杂的排版,是件很苦逼的事情.对此的解决方案有使用CoreText进行绘制,或者使用TextKit.本文主要讲解对于CoreT ...
- CoreText 实现图文混排
CoreText 实现图文混排 相关博文推荐 IOS CoreText.framework - 基本用法 IOS CoreText.framework - 段落样子CTParagraphStyle h ...
- 自定义图文混排视图MyImageTextView
http://blog.csdn.net/xujunfeng000/article/details/36399339?utm_source=tuicool&utm_medium=referra ...
- AS3聊天单行输入框图文混排完美实现
几年前刚毕业.第一个游戏模块做的就是聊天.到如今.几个游戏写过几次聊天模块. 之前在4399做的<幻龙骑士>(又名<神骑士>),还有上周六刚上线的<疯狂的子弹>, ...
- CoreText实现图文混排
CoreText的介绍 Core Text 是基于 iOS 3.2+ 和 OSX 10.5+ 的一种能够对文本格式和文本布局进行精细控制的文本引擎.它良好的结合了 UIKit 和 Core Graph ...
随机推荐
- fetch跨域浏览器请求头待研究
fetch('https://wwww.baidu.com', {headers: { "Access-Control-Allow-Origin": "*", ...
- Linux c使用gumbo库解析页面表单信息(二)
一.如何在程序当中使用gumbo? 要想在代码中使用gumbo,仅仅包含gumbo头文件是不够的,必须在编译程序的时候加上-lgumbo选项,编译程序才会链接到gumbo库上面. 这是我编译gumbo ...
- null 和System.DBNull.Value
row[column]的值为DBNull.Value的话,说明它是从数据库中取到值了,对应了数据库中的空值:但如果row[column]的值为null的话,说明没有从数据库中取到值. DBNull.V ...
- UML之顺序图
一 定义 顺序图是将交互关系表示为一个二维图.纵向是时间轴(生命线),时间沿竖线向下延伸.横向轴代表了在协作中各独立对象的类元角色.类元角色用生命线表示.当对象存在时,角色用一条虚线表示,当对象的过程 ...
- canal-client无法获取数据
在虚拟机单cpu环境下 canal.properties配置中 #canal.instance.parser.parallelThreadSize = 16 那么,MysqlMultiStageCop ...
- c++常量指针和指针常量的区别
int a:int * const p = &a: //指针常量,*p可以修改*p = 8:(OK) p不可以修改 p++(ERROR) int a,b:const int *p = & ...
- 解决eclipse的自动换行问题。
安装方法:使用Eclipse 的自动升级功能,菜单栏选Help → install new Software 点解Add按钮,在“ Name ”中填入“ wordwrap ”,“ URL ”中填入“ ...
- elasticsearch5.0以上版本及head插件的安装
本文转载至:https://www.cnblogs.com/hts-technology/p/8477258.html(针对5.0以上版本) 对于es5.0以下的版本可以参考:https://www. ...
- CDN原理介绍(转)
内容分发网络(Content delivery network或Content distribution network,缩写:CDN)是指一种通过互联网互相连接的电脑网络系统,利用最靠近每位用户的服 ...
- EM算法(期望最大化算法)
适用场景:存在为未测变量的情况下,对模型参数进行估计. EM算法: input:观测数据Y,为观测数据Z,联合分布P(Y,Z|θ),条件分布P(Z|Y,θ) output:模型参数θ 步骤: (1)选 ...