1,把kindeditor的包放在了/static/目錄下,而後引入下面的幾個包(使用的最簡模式)css
<link href="{% static 'kindeditor/themes/default/default.css' %}" rel="stylesheet"> <script src="{% static 'kindeditor/kindeditor-all-min.js' %}"></script> <script src="{% static 'kindeditor/lang/zh-CN.js' %}"></script>
2,js代碼html
var editor; KindEditor.ready(function(K) { editor = K.create('textarea[name="content"]', { resizeType : 1, allowPreviewEmoticons : false, <!--去掉遠程上傳的功能--> allowImageRemote : false, <!--後臺處理上傳圖片的功url--> uploadJson : '/main/uploadImg/', items : [ 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline', 'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist', 'insertunorderedlist', '|', 'emoticons', 'image', 'link'] }); })
3,後臺代碼python
@csrf_exempt def uploadImg(request): if request.method == 'POST': file_obj = open("log.txt","w+") buf = request.FILES.get('imgFile', None) print >> file_obj,str(buf) file_buff = buf.read() time_format=str(time.strftime("%Y-%m-%d-%H%M%S",time.localtime())) try: file_name = "img_"+time_format+".jpg" save_file("main/static/content_img", file_name, file_buff) dict_tmp = {} dict_tmp["error"] = 0 dict_tmp["url"] = "/static/content_img/"+file_name return HttpResponse(json.dumps(dict_tmp)) except Exception,e: dict_tmp = {} dict_tmp["error"] = 1 print >> file_obj,e return HttpResponse(json.dumps(dict_tmp)) #對path進行處理 def mkdir(path): # 去除左右兩邊的空格 path=path.strip() # 去除尾部 \符號 path=path.rstrip("\\") if not os.path.exists(path): os.makedirs(path) return path #保存相關的文件 def save_file(path, file_name, data): if data == None: return mkdir(path) if(not path.endswith("/")): path=path+"/" file=open(path+file_name, "wb") file.write(data) file.flush() file.close()
4,注意,後臺成功和失敗後返回的json格式和字段,不然上傳成功,可是前臺沒反映。這個的效果是前臺上傳完畢,當即顯示在kindeditor的編輯框裏,返回的url就是讓kindeditor找到這個圖片
json