富文本编辑器

引用的kindeditor编辑器。
kindeditor： http://kindeditor.net/demo.php

1. 引用文本框

1. 绑定文本框id

   
   
   
   
   

   2.常用属性

KindEditor.ready(function (K) {
        window.editor = K.create('#article_content', {
            width:'700px',
            heigth:'100px',
            // 显示列表中的功能
            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', 'selectall', '|', 'fullscreen', '/',
        'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
        'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage',
        'flash', 'media', 'insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak',
        'anchor', 'link', 'unlink', '|', 'about'
            ],
            // 2或1或0，2时可以拖动改变宽度和高度，1时只能改变高度，0时不能拖动。
            resizeType:0,
            // 指定上传文件的服务器端程序。
            uploadJson:"/upload/",
            // 上传图片、Flash、视音频、文件时，支持添加别的参数一并传到服务器。
            // eg. csrf_token
             extraFileUploadParams : {
                        csrfmiddlewaretoken:$("[name='csrfmiddlewaretoken']").val()
                },
            // 指定上传文件form名称。
            filePostName:"upload_img",

        });
    });

3. 上传图片设置

• 在uploadJson中设置上传url
• views中写函数,返回一个json字符串
  导入settings中的设置

# media配置，用户上传的文件都默认放在这个文件夹下
MEDIA_ROOT = os.path.join(BASE_DIR, "media")

def upload(request):
    obj = request.FILES.get("upload_img")
    print(obj.name)
    path = os.path.join(settings.MEDIA_ROOT, "add_article_img", obj.name)
    with open(path, "wb") as f:
        for chunk in obj.chunks():
            f.write(chunk)
    ret = {
        "error": 0,
        "url": "/media/add_article_img/"+obj.name,
    }
    return HttpResponse(json.dumps(ret))