引用的kindeditor编辑器。
kindeditor： http://kindeditor.net/demo.php
- 引用文本框
<script charset="utf-8" src="/editor/kindeditor.js"></script>
<script charset="utf-8" src="/editor/lang/zh-CN.js"></script>
<script>
KindEditor.ready(function(K) {
window.editor = K.create('#editor_id');
});
</script>
-
绑定文本框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",
});
});
- 上传图片设置
- 在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))
