在博客内置文本编辑器

我用的是最简单粗暴的编辑器kindeditor。官网:http://kindeditor.net/demo.php

一、下载文件

在官网下载js文件并放到项目中,不用的功能可以删除掉,主要功能在:kindeditor-all-min.js里,保留themes文件,其他不需要可以全部删除

二、引用js文件,和textarea绑定

KindEditor.ready(function (K) {
            window.editor = K.create('#id_content', {
                 '800px',
                height: '500px',
                resizeType: 0,
                uploadJson: '/upload/',
                extraFileUploadParams: {
                    csrfmiddlewaretoken: $('[name="csrfmiddlewaretoken"]').val()
                },
                filePostName: 'upload_img',
            });
        });

注意id_content是绑定的textarea,下面的参数是根据自己的需求订制编辑器,具体内容可以看文档:http://kindeditor.net/docs/option.html

三、编辑器的上传功能

# urls.py
path('upload/', views.upload, name='upload')

# views.py
def upload(request):
    img = request.FILES.get('upload_img')
    path = os.path.join(settings.MEDIA_ROOT, 'add_article_img', img.name)
    with open(path, 'wb') as f:
        for line in img:
            f.write(line)

    response = {
        'error': 0,
        'url': f'/media/add_article_img/{img.name}'  # 文件预览,参数必须是url
    }

    return JsonResponse(response)
原文地址:https://www.cnblogs.com/lshedward/p/10404740.html