第一步:在jsp页面中引入
<script charset="utf-8" src="kindeditor-4.1.10/kindeditor.js"></script>
<script charset="utf-8" src="kindeditor-4.1.10/lang/zh_CN.js"></script>
第二步:在body中需要使用的kindedit编辑器处写下这一行代码——
<div><textarea name="intro" style="width:900px;height:300px;" id="editor_id"></textarea></div>
第三步:在jsp页面中写下调用kindedit编辑器的代码——
<script>
KindEditor.ready(function(K) {
window.editor = K.create('#editor_id');
});
var options = {
cssPath : '/css/index.css',
filterMode : true
};
var editor = K.create('textarea[name="content"]', options);
// 取得HTML内容
html = editor.html();
// 同步数据后可以直接取得textarea的value
editor.sync();
html = document.getElementById('editor_id').value; // 原生API
html = K('#editor_id').val(); // KindEditor Node API
html = $('#editor_id').val(); // jQuery
// 设置HTML内容
editor.html('HTML内容');
</script>
第四步:修改image.js中的plugin方法中的上传方式,在kindeditor-4.1.10\plugins\image下,将默认的php/upload_php改为jsp/upload_json.jsp
即将uploadJson = K.undef(self.uploadJson, self.basePath + 'jsp/upload_json.jsp'),中的”php/upload_php“改为”jsp/upload_json.jsp“
第五步:修改upload_json.jsp 文件
把一下部分代码
-
FileItemFactory factory = new DiskFileItemFactory();
ServletFileUpload upload = new ServletFileUpload(factory);
upload.setHeaderEncoding("UTF-8");
List items = upload.parseRequest(request);
Iterator itr = items.iterator();
while (itr.hasNext()) {
FileItem item = (FileItem) itr.next();
String fileName = item.getName();
long fileSize = item.getSize();
if (!item.isFormField()) {
//检查文件大小
if(item.getSize() > maxSize){
out.println(getError("上传文件大小超过限制。"));
return;
}
//检查扩展名
String fileExt = fileName.substring(fileName.lastIndexOf(".") + 1).toLowerCase();
if(!Arrays.<String>asList(extMap.get(dirName).split(",")).contains(fileExt)){
out.println(getError("上传文件扩展名是不允许的扩展名。\n只允许" + extMap.get(dirName) + "格式。"));
return;
}
SimpleDateFormat df = new SimpleDateFormat("yyyyMMddHHmmss");
String newFileName = df.format(new Date()) + "_" + new Random().nextInt(1000) + "." + fileExt;
try{
File uploadedFile = new File(savePath, newFileName);
item.write(uploadedFile);
}catch(Exception e){
out.println(getError("上传文件失败。"));
return;
}
JSONObject obj = new JSONObject();
obj.put("error", 0);
obj.put("url", saveUrl + newFileName);
out.println(obj.toJSONString());
}
}
/* 一下是替换原先的代码段 */
MultiPartRequestWrapper wrapper = (MultiPartRequestWrapper) request;
//获得上传的文件名
String fileName = wrapper.getFileNames("imgFile")[0];//imgFile,imgFile,imgFile
//获得文件过滤器
File file = wrapper.getFiles("imgFile")[0];
//检查扩展名
String fileExt = fileName.substring(fileName.lastIndexOf(".") + 1).toLowerCase();
if(!Arrays.<String>asList(extMap.get(dirName).split(",")).contains(fileExt)) {
out.println(getError("上传文件扩展名是不允许的扩展名。\n只允许" + extMap.get(dirName) + "格式。"));
return;
}
//检查文件大小
if (file.length() > maxSize) {
out.println(getError("上传文件大小超过限制。"));
return;
}
//重构上传图片的名称
SimpleDateFormat df = new SimpleDateFormat("yyyyMMddHHmmss");
String newImgName = df.format(new Date()) + "_"
+ new Random().nextInt(1000) + "." + fileExt;
byte[] buffer = new byte[1024];
//获取文件输出流
FileOutputStream fos = new FileOutputStream(savePath +"/" + newImgName);
//System.out.println("########" + saveUrl + "@@"+ newImgName);
//获取内存中当前文件输入流
InputStream in = new FileInputStream(file);
try{
int num = 0;
while ((num = in.read(buffer)) > 0){
fos.write(buffer, 0, num);
}
}
catch (Exception e){
e.printStackTrace(System.err);
} finally{
in.close();
fos.close();
}
JSONObject obj = new JSONObject();
obj.put("error", 0);
obj.put("url", saveUrl + newImgName);
out.println(obj.toJSONString());
这样就ok啦