KindEditor

時間 2019-11-13

標籤 kindeditor 简体版

原文原文鏈接

二、下載html

官網下載：http://kindeditor.net/down.php
本地下載：http://files.cnblogs.com/files/wupeiqi/kindeditor_a5.zip

三、文件夾說明前端

├── 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主題

四、基本使用java

<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>

五、詳細參數python

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

六、上傳文件示例數據庫

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>$Title$</title>
</head>
<body>
<h3>發佈文章</h3>
<form action="/background/{{ site }}/create_article.html" method="POST">
    {% csrf_token %}
    文章標題<input type="text">
    <textarea name="content" id="i1" cols="30" rows="10"></textarea>
    <input type="submit" value="提交"  style="margin-left: 35%">
</form>

<script src="/static/kindeditor-4.1.10/kindeditor-all.js"></script>
<script>
    // KindEditor 上傳的瞬間，幫你生成iframe+form進行僞Ajax操做
    KindEditor.create('#i1',{
        width:'1000px',
        height:'500px',
        resizeType:2,   // 默認是否能夠拖動改變高度和寬帶，0,1,2，其中默認是2，能夠拖動改變寬度和高度。
        uploadJson:'/upload_img.html', // 上傳文件位置，注意不能寫目錄/static/files...相似這種，識別不了。要寫url
        // 注意：上傳文件時，是以POST請求提交的，可是要寫上{% csrf_token %}，上面表單中寫的上傳文件時無法用到，要配置
        extraFileUploadParams:{'csrfmiddlewaretoken':"{{ csrf_token }}"}

    })
</script>
</body>
</html>

creat_article

CONTENT=''
def create_article(request,site):
    from app01.form import ArticleForm
    if request.method == 'GET':
        obj = ArticleForm()
        return render(request,'creat_article.html',{'site':site})
    else:
        obj = ArticleForm(request.POST)
        if obj.is_valid():
            content = obj.cleaned_data['content']
            global CONTENT      #這裏記得要設置全局變量
            CONTENT = content
            return HttpResponse('上傳成功')



# 查看文章內容，只是簡單的
def see(request):
    return render(request,'see.html',{'CONTENT':CONTENT})



#文件的上傳
def upload_img(request):
    print(request.FILES,request.POST)
    obj_file = request.FILES.get('imgFile') # 根據request.FILES得出的字典的key值是imgFile

    upload_type =request.GET.get('dir')
    print(upload_type)  # image
    # 須要補上代碼，進行判斷，當上傳文件類型爲 image 時放在一個目錄，當上傳文件類型爲其餘時放在一個目錄，便於管理
    import os
    file_path=os.path.join('static/imgs',obj_file.name)
    with open(file_path,'wb') as f:
        for chunk in obj_file.chunks():
            f.write(chunk)
    #還須要補充的代碼是將數據更新到數據庫中
    # 上面只實現了上傳，dic 默認的寫法，而且要返回給前端，才能實現預覽。
    dic={
        'error':0,
        'url': '/'+ file_path,
        'message':'出錯了....'
    }
    import json
    return HttpResponse(json.dumps(dic))

app01/views

七、XSS過濾特殊標籤json

處理依賴api

pip3 install beautifulsoup4

具體XSS模塊的封裝參考：http://www.cnblogs.com/xuyaping/p/7218132.html　　app

1. kindeditor API ，kindeditor應用手冊，kindeditor函數
2. KindEditor
3. kindeditor
4. Django配置-KindEditor
5. KindEditor的用法
6. KindEditor 編輯器
7. KindEditor 是什麼？
8. kindEditor PHP示例
9. kindeditor留言板
10. kindeditor整合
更多相關文章...

相關標籤/搜索

kindeditor

kindeditor&ckplayer

springmvc+kindeditor

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。