KindEditor是一套开源的HTML可视化编辑器,主要用于让用户在网站上获得所见即所得编辑效果,兼容IE、Firefox、Chrome、Safari、Opera等主流浏览器。

1. 准备

2. 写一个kind的URL,定义函数,写前端页面

kind.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div style="width:500px;margin:0 auto">
<textarea id="content"></textarea>
</div>
<script src="/static/jquery-1.12.4.js"></script>
<script src="/static/kindeditor-4.1.10/kindeditor-all.js"></script>
<script>
$(function(){
KindEditor.create('#content',{});
})
</script>
</body>
</html>

页面效果:

3. 通过把下列参数写到字典中,来调整个性化页面。

详细参数可以参考:http://kindeditor.net/docs/option.html

3.1 详解items参数

效果:

3.2  用 noDisableItems 可以让某些图标能看到,但是不能操作。

3.3 文件上传---uploadJson

发现上传文件的时候,默认是提交到某一个固定的URL。(如下)

通过uploadJson可以自定制上传到哪里

效果:

对应地,我们应该在URL中添加upload_img路径。

3.4 拿到上传的文件以后,应该保存并且返回给用户。

这里省略了保存的过程,直接把图片放到这个目录下进行下一步。

views.py

def kind(request):
return render(request,'kind.html') def upload_img(request):
#在这里需要接收文件并且保存,然后返回给用户。是以POST方式提交的。在这里没有写保存的范本。
print(request.FILES)
import json
dic={
'error':0, #0代表是正确的,1代表是错误的。
'url':'/static/imgs/1.png', ##把静态文件的路径返回到URL这里,所以在页面上就可以做预览了。
'message':'错误了...' } return HttpResponse(json.dumps(dic))

页面效果:点击上传图片以后就可以预览了。在内部用的是iframe+form

4. allowImageUpload: false(不允许),true(允许) 是否允许图片上传。

 allowImageRemote: 是否允许远程的图片上传。

5. autoHeightMode: true 自动增加高度

6. fileManagerJson:'/file_manager/' 文件管理的路径

allowFileManager:true 文件管理

7. extraFileUploadParams: 上传照片的时候,加上额外的参数(CSRF_TOKEN)

filePostName: 指定上传文件form的名称。

8. 增加文件空间管理的模块

9. XSS特殊字符的过滤

Day24-KindEditor基本使用和文件操作2的更多相关文章

  1. kindeditor 上传下载文件

    jsp代码 1 <script type="text/javascript" src="${pageContext.request.contextPath}/kin ...

  2. 【.NET深呼吸】Zip文件操作(1):创建和读取zip文档

    .net的IO操作支持对zip文件的创建.读写和更新.使用起来也比较简单,.net的一向作风,东西都准备好了,至于如何使用,请看着办. 要对zip文件进行操作,主要用到以下三个类: 1.ZipFile ...

  3. 野路子出身PowerShell 文件操作实用功能

    本文出处:http://www.cnblogs.com/wy123/p/6129498.html 因工作需要,处理一批文件,本想写C#来处理的,后来想想这个是PowerShell的天职,索性就网上各种 ...

  4. Node基础篇(文件操作)

    文件操作 相关模块 Node内核提供了很多与文件操作相关的模块,每个模块都提供了一些最基本的操作API,在NPM中也有社区提供的功能包 fs: 基础的文件操作 API path: 提供和路径相关的操作 ...

  5. 归档NSKeyedArchiver解归档NSKeyedUnarchiver与文件管理类NSFileManager (文件操作)

    ========================== 文件操作 ========================== 一.归档NSKeyedArchiver 1.第一种方式:存储一种数据. // 归档 ...

  6. SQL Server附加数据库报错:无法打开物理文件,操作系统错误5

    问题描述:      附加数据时,提示无法打开物理文件,操作系统错误5.如下图: 问题原因:可能是文件访问权限方面的问题. 解决方案:找到数据库的mdf和ldf文件,赋予权限即可.如下图: 找到mdf ...

  7. 通过cmd完成FTP上传文件操作

    一直使用 FileZilla 这个工具进行相关的 FTP 操作,而在某一次版本升级之后,发现不太好用了,连接老是掉,再后来完全连接不上去. 改用了一段时间的 Web 版的 FTP 工具,后来那个页面也 ...

  8. Linux文件操作的主要接口API及相关细节

    操作系统API: 1.API是一些函数,这些函数是由linux系统提供支持的,由应用层程序来使用,应用层程序通过调用API来调用操作系统中的各种功能,来干活 文件操作的一般步骤: 1.在linux系统 ...

  9. C语言的fopen函数(文件操作/读写)

    头文件:#include <stdio.h> fopen()是一个常用的函数,用来以指定的方式打开文件,其原型为:    FILE * fopen(const char * path, c ...

  10. Python的文件操作

    文件操作,顾名思义,就是对磁盘上已经存在的文件进行各种操作,文本文件就是读和写. 1. 文件的操作流程 (1)打开文件,得到文件句柄并赋值给一个变量 (2)通过句柄对文件进行操作 (3)关闭文件 现有 ...

随机推荐

  1. SAP调用RestfulApi接口接收数据

    因为准备要做一个关于调用外部接口的需求,所以自己先练习一下. 程序说明:我已经在.net开发的系统里提供一个api接口,现在在sap访问这个接口,来接收数据. 这里涉及Restful Api知识,以后 ...

  2. 20155316 Exp1 PC平台逆向破解(5)M

    前绪 实验收获与感想 初步从三个途径了解了什么是缓冲区溢出以及如何简单实现它,对汇编与反汇编有更直观的了解. 什么是漏洞?漏洞有什么危害? 漏洞是指机器体制设计时所没有顾及到的.可以被利用的bug,放 ...

  3. 20155330 《网络对抗》 Exp8 Web基础

    20155330 <网络对抗> Exp8 Web基础 实验问题回答 什么是表单 表单可以收集用户的信息和反馈意见,是网站管理者与浏览者之间沟通的桥梁. 一个表单有三个基本组成部分 表单标签 ...

  4. SpingMVC的<context:component-scan>包扫描踩坑记录

        公司项目配置的Spring项目的包扫描有点问题,出现了一个被Spring容器管理的Bean被创建了2次的现象.在此记录下解决的过程,方便后续查阅. 改动前: 容器启动监听器中会扫描全部包,创建 ...

  5. LoRa---射频信号接收框架简图介绍

    LoRa整体框架图如下: 内容下次再填! 内容补上: 射频信号的接收流程(小博并非专业,错了emmmmm轻喷):射频--->中频--->基带,下面按照图中标的序号开始介绍: 1.天线接受射 ...

  6. R语言学习 第四篇:函数和流程控制

    变量用于临时存储数据,而函数用于操作数据,实现代码的重复使用.在R中,函数只是另一种数据类型的变量,可以被分配,操作,甚至把函数作为参数传递给其他函数.分支控制和循环控制,和通用编程语言的风格很相似, ...

  7. Mysql + Mybatis动态建表

    service层业务 package com.zx.common.service.impl; import com.zx.common.entity.SysUser; import com.zx.co ...

  8. supervisor管理进程 superlance对进程状态报警

    supervisor介绍 首先,介绍一下supervisor.Supervisor(http://supervisord.org/)是用Python开发的一个client/server服务,是Linu ...

  9. App推荐 | Google Tasks

    前不久,Google推出了一款移动任务管理应用Google Task,在使用2天后,写一下使用感受,并与Google同类产品Keep进行一个对比. 首先欣赏几张官方的App截图 然后来看一下官方的介绍 ...

  10. linux一切皆文件之块设备文件(四)

    一.知识准备 1.在linux中,一切皆为文件,所有不同种类的类型都被抽象成文件(比如:块设备,socket套接字,pipe队列) 2.操作这些不同的类型就像操作文件一样,比如增删改查等 3.块设备是 ...