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. 深入解析Java中的装箱和拆箱

    自己主动装箱和拆箱问题是Java中一个老生常谈的问题了,今天我们就来一些看一下装箱和拆箱中的若干问题.本文先讲述装箱和拆箱最主要的东西,再来看一以下试笔试中常常遇到的与装箱.拆箱相关的问题. 下面是本 ...

  2. Django Rest Framework源码剖析(一)-----认证

    一.简介 Django REST Framework(简称DRF),是一个用于构建Web API的强大且灵活的工具包. 先说说REST:REST是一种Web API设计标准,是目前比较成熟的一套互联网 ...

  3. [Python]-pip-ReadTimeoutError: Read timed out 问题

    问题描述 就是在安装Python包的时候,由于时间太长引起的超时问题 问题解决 第一个办法是更改源地址:在 ~/.pip/ 下创建文件 pip.conf(如果还没有的话), 模版如下: [global ...

  4. jdbc获取blob类型乱码

    一.使用场景: mysql数据库字段类型为longblob,在数据库里看中文字符正常,java读取字串的时候发现中文乱码 使用到了activeMq 二.排查: (1)修改eclipse的环境编码为ut ...

  5. Luogu P2483 【模板】k短路（[SDOI2010]魔法猪学院）

    说实话,看到这道题的洛谷评级我傻了(传说中的最高难度) 然后看完题目才确定这真的是一道k短路的裸题. 也就敲了个A*吧,15分钟竟然没有调试一遍过. 欧洲玄学. 看题目,主要是找几条从1走到n的路加起 ...

  6. Asp.Net_Wcf跟Wpf的区别

    摘要:WCF,你就先把它想成WebService的下一代也没什么问题.WCF为WindowsCommunicationFoundation,是Microsoft为构建面向服务的应用提供的分布式通信编程 ...

  7. 记录：TensorFlow 中的 padding 方式

    TensorFlow 中卷积操作和池化操作中都有一个参数 padding,其可选值有 ['VALID', 'SAME']. 在 TensorFlow 文档中只是给出了输出张量的维度计算方式,但是并没有 ...

  8. Bloom Filter解析

    布隆过滤器简介:https://www.cnblogs.com/Jack47/p/bloom_filter_intro.html 布隆过滤器详解:原文链接:http://www.cnblogs.com ...

  9. 红黑树插入与删除完整代码（dart语言实现）

    之前分析了红黑树的删除,这里附上红黑树的完整版代码,包括查找.插入.删除等.删除后修复实现了两种算法,均比之前的更为简洁.一种是我自己的实现,代码非常简洁,行数更少:一种是Linux.Java等源码版 ...

  10. 小刘的机器学习---SVM

    前言: 这是一篇记录小刘学习机器学习过程的随笔. 正文: 支持向量机(SVM)是一组用于分类, 回归和异常值检测的监督学习方法. 在分类问题中,SVM就是要找到一个同时离各个类别尽可能远的决策边界即最 ...