python 文本编辑器(KindEditord)

1、下载

  • 官网下载：http://kindeditor.net/down.php
  • 本地下载：http://files.cnblogs.com/files/wupeiqi/kindeditor_a5.zip

2、文件夹说明

1
2
3
4
5
6
7
8
9
10
11
12
13
14
├── asp                          asp示例
├── asp.net                    asp.net示例
├── attached                  空文件夹，放置关联文件attached
├── examples                 HTML示例
├── jsp                          java示例
├── kindeditor-all-min.js 全部JS（压缩）
├── kindeditor-all.js        全部JS（未压缩）
├── kindeditor-min.js      仅KindEditor JS（压缩）
├── kindeditor.js            仅KindEditor JS（未压缩）
├── lang                        支持语言
├── license.txt               License
├── php                        PHP示例
├── plugins                    KindEditor内部使用的插件
└── themes                   KindEditor主题

3、基本使用

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<textarea name="content" id="content"></textarea>
  
<script src="/static/jquery-1.12.4.js"></script>
<script src="/static/plugins/kind-editor/kindeditor-all.js"></script>
<script>
    $(function () {
        initKindEditor();
    });
  
    function initKindEditor() {
        var kind = KindEditor.create('#content', {
            width: '100%',       // 文本框宽度(可以百分比或像素)
            height: '300px',     // 文本框高度(只能像素)
            minWidth: 200,       // 最小宽度（数字）
            minHeight: 400      // 最小高度（数字）
        });
    }
</script>

4、详细参数

http://kindeditor.net/docs/option.html

5、上传文件本质：上传图片时,点击上传 会默认帮你生成ifrem和form标签,然后在form标签里生成一个image标签，以Ajax方式发送到后台(伪Ajax)

CONIENT = ""

def test(request):

    if request.method == "GET":

        return render(request,"test.html")

    else:

        content = request.POST.get("content")

        global CONIENT

        CONIENT = content

        print(content)

        return HttpResponse("...")

def see(request):

    return render(request,"see.html",{"con":CONIENT})

import os

def upload_img(request):

    #在之后可以根据获取到的dir判断是视频还是文件，这里没有用到

    type_obj = request.POST.get("dir")

    print(request.POST, request.FILES)

    file_obj = request.FILES.get("imgFile")

    file_path = os.path.join("static/images/",file_obj.name)

    with open(file_path,"wb") as f:

        for chunk in file_obj.chunks():

            f.write(chunk)

    #返回前端,可以预览

    dic = {

        'error': 0,

        'url': "/" +  file_path,

        'message': '错误了...'

    }

    import json

    return HttpResponse(json.dumps(dic))

Views

urlpatterns = [

    #上传图片，写文章

    url(r'^test/', views.test),

    #查看写的文章

    url(r'^see/', views.see),

    #上传图  视频 文件

    url(r'^upload_img.html', views.upload_img),
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title></title>

</head>

<body>

    <form method="POST" action="/test/">

        {% csrf_token %}

        <div>

            <div>文章内容</div>

            <div>

                <textarea id="id1" name="content"></textarea>

            </div>

        </div>

        <input type="submit" value="提交">

    </form>

    <script src="/static/css/kindeditor-4.1.10/kindeditor-all.js"></script>

    <script>

        KindEditor.create("#id1",{

            width:"700px",

            height:"800px",

{#            //items:['source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'code', 'cut', 'copy', 'paste',#}

             //       'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',

              //      'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',

                //    'superscript', 'clearhtml', 'quickformat'],

            //noDisableItems:['source', '|', 'undo'],     //保留某些item

            //designMode:false                            //其它注释

           //resizeType   改变窗口大小

            uploadJson:"/upload_img.html",  //上传文件

            extraFileUploadParams:{         //上传文件时携带token

                "csrfmiddlewaretoken":"{{ csrf_token }}"

            }

        })

    </script>

</body>

</html>

test.html

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    {{ con | safe }}

</body>

</html>

see.html

python KindEditord的更多相关文章

  1. python学习目录(转载)

    python基础篇 python 基础知识    python 初始python    python 字符编码    python 类型及变量    python 字符串详解 python 列表详解 ...

  2. python之路1

    python之路 http协议 html HTML2 CSS选择器 CSS属性操作 CSS属性操作/下 JavaScript(js)/上 JavaScript的对象 JavaScript的对象/下 前 ...

  3. Python中的多进程与多线程（一）

    一.背景 最近在Azkaban的测试工作中,需要在测试环境下模拟线上的调度场景进行稳定性测试.故而重操python旧业,通过python编写脚本来构造类似线上的调度场景.在脚本编写过程中,碰到这样一个 ...

  4. Python高手之路【六】python基础之字符串格式化

    Python的字符串格式化有两种方式: 百分号方式.format方式 百分号的方式相对来说比较老,而format方式则是比较先进的方式,企图替换古老的方式,目前两者并存.[PEP-3101] This ...

  5. Python 小而美的函数

    python提供了一些有趣且实用的函数,如any all zip,这些函数能够大幅简化我们得代码,可以更优雅的处理可迭代的对象,同时使用的时候也得注意一些情况   any any(iterable) ...

  6. JavaScript之父Brendan Eich，Clojure 创建者Rich Hickey，Python创建者Van Rossum等编程大牛对程序员的职业建议

    软件开发是现时很火的职业.据美国劳动局发布的一项统计数据显示,从2014年至2024年,美国就业市场对开发人员的需求量将增长17%,而这个增长率比起所有职业的平均需求量高出了7%.很多人年轻人会选择编 ...

  7. 可爱的豆子——使用Beans思想让Python代码更易维护

    title: 可爱的豆子--使用Beans思想让Python代码更易维护 toc: false comments: true date: 2016-06-19 21:43:33 tags: [Pyth ...

  8. 使用Python保存屏幕截图（不使用PIL）

    起因 在极客学院讲授<使用Python编写远程控制程序>的课程中,涉及到查看被控制电脑屏幕截图的功能. 如果使用PIL,这个需求只需要三行代码: from PIL import Image ...

  9. Python编码记录

    字节流和字符串 当使用Python定义一个字符串时,实际会存储一个字节串: "abc"--[97][98][99] python2.x默认会把所有的字符串当做ASCII码来对待,但 ...

随机推荐

  1. Mac环境下使用VSCode搭建Go开发环境

    换新工作啦!!!开心一下.到了新公司一看,乖乖,全MAC办公,让我这只用过windows的土包子怎么活,而且公司的人都好高冷,于是自己摸索着搭建go语言开发环境了. go语言的ide挺多的,JetBr ...

  2. web SPA项目目录、命名规范

    项目结构:├── build ├── docs ├── package.json ├── src │ ├── components │ │ ├── List │ │ │ ├── index.js │ ...

  3. Python sort后赋值 操作陷阱

    x=[1,4,2,0] # 错误的方式,因为sort没有返回值 y=x.sort() type (y) #NoneType #正确的方式 x.sort() y=x[:]

  4. 安装Keras

    在cmd窗口运行代码: pip install keras -U --pre 安装Keras: 进入Python环境,运行import keras,检验是否成功安装.

  5. 玩转接口测试工具fiddler 教程系列1

    我们在做web测试的时候,很多时候需要查看接口发送的数据返回的数据是否正常,这样可以排除是客户端的问题还是服务器的问题,举个例子来说,如果我们发现页面上面数据少了, 通过fiddler查看数据返回就少 ...

  6. phpcms v9 搜索结果列表页时间显示1970问题解决方案

    对于喜欢用phpcms v9 的小伙伴来说,在调用时间时,总会出现时间1970这样的问题,对于这个问题,网上的说法很多,内容页时间显示通常不会问题,搜索结果页就不行了,通过总结,发现使用{format ...

  7. CentOS 6.5 通过命令行安装发送邮件

    1.安装sendmail: yum install sendmail 2.安装mailx: yum install mailx -y 3.编辑发送的配置文件: vi /etc/mail.rc #在最后 ...

  8. 如何防止cookie被串改

    在这里我不想多说怎么去操作cookie了,网上博文一大堆,大家可以去自行搜索,在这里也是记录一下自己的知识,以便以后方便查阅.当我们在浏览器地址栏输入地址成功打开网页以后,服务器会把一些信息写入coo ...

  9. JavaWeb学习笔记四 request&response

    HttpServletResponse 我们在创建Servlet时会覆盖service()方法,或doGet()/doPost(),这些方法都有两个参数,一个为代表请求的request和代表响应res ...

  10. Active MQ 实战(一)

    1.什么是JMS JMS即Java消息服务(Java Message Service)应用程序接口,是一个Java平台中关于面向消息中间件(MOM)的API,用于在两个应用程序之间,或分布式系统中发送 ...