1.导入资源包 kindeditor-all-min.js；
官网或者https://download.csdn.net/download/leadseczgw01/11015747；
2.页面元素（只需要一个textarea）
html<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>kindeditor demo</title>
</head>
<body>
<textarea id="textareaId" cols="160" rows="20"></textarea>
<script type="text/javascript" src="/console/js/kindeditor-4.1.10/kindeditor-all-min.js"></script>
<script type="text/javascript" src="/console/js/kindeditor-4.1.10/lang/zh_CN.js"></script>
<script type="text/javascript">
// 编辑器参数
var kingEditorParams = {
//指定上传文件参数名称
filePostName : "uploadFile",
//指定上传文件请求的url
uploadJson : '/console/upload/uploadFck.do',
//上传类型，分别为image、flash、media、file
dir : "image"
};
KindEditor.create('#textareaId',kingEditorParams);
KindEditor.sync();
</script>
</body>
</html>3.效果
4.后台接收kindeditor上传的图片等资源
// kindeditor上传
@RequestMapping("uploadFck.do")
public void uploadFck(MultipartFile uploadFile, HttpServletRequest request, HttpServletResponse response){
try {
// 图片保存到本地
String imgUrl = SaveFileUtil.saveFileToLocal(uploadFile, request.getSession().getServletContext().getRealPath("/"));
String basePath = request.getContextPath();
imgUrl = basePath+"/"+imgUrl;
// 响应上传结果
JSONObject jsonObject = new JSONObject();
jsonObject.put("url",imgUrl); // 固定
jsonObject.put("error",0); // 固定
response.setContentType("application/json;charset=UTF-8");
PrintWriter writer = response.getWriter();
writer.write(jsonObject.toString());
writer.flush();
} catch (IOException e) {
e.printStackTrace();
}
}5.若要将整个textarea作为form的一部分提交，只需要在textarea中添加name属性；传送到后台时，若kindeditor中有图片和文字，kindeditor会先将图片上传到后台，并获取到资源的url，提交到后台的内容将是资源url和文本字符串。
4572
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
