Kindeditor的图片上传和图片管理
引入先关文件
<!--引入kindeditor相关js,css-->
<script type="text/javascript" src="../../edit/kindeditor.js" ></script>
<link rel="stylesheet" href="../../edit/themes/default/default.css" />
<script type="text/javascript" src="../../edit/lang/zh_CN.js" ></script>
系统提供的默认实现
1.在页面设置kindeditor的属性,指定使用默认的JSP实现
- uploadJson : ‘../../editor/jsp/upload_json.jsp’,
必须配置:指定上传文件程序的位置。 - allowFileManager:true,
可选,如果使用图片管理器,进行设置 - fileManagerJson : ‘../../editor/jsp/file_manager_json.jsp’
设置图片管理器的实现程序
2.将下载的kindeditor的有关JSP的默认实现复制到项目中
01 安装文件\kindeditor\jsp 路径下
Lib: 当前上传文件依赖的jar
json_simple-1.1.jar 是kindeditor自己设置的一个JSON转换包,必须导入
a)maven:
执行命令之前,需要配置maven_home,path。
到当前jar包所在的路径下,执行:
mvn install:install-file -Dfile=json_simple-1.1.jar -DgroupId=com.kindeditor.json -DartifactId=kindeditor -Dversion=1.0 -Dpackaging=jar
b)将jar包复制到 WEB-INF/lib文件夹下
3.将剩下的JSP文件复制到editor目录下
- upload_json.jsp JSP版的文件上传
- file_manager_json.jsp JSP版的文件管理器
4.文件上传的说明,
默认情况下,官方自带的程序,将上传的图片按照日期保存在attached文件夹下
应该在项目中,手动创建该文件夹。
5.运行程序的tomcat插件必须是tomcat7
<plugin>
<groupId>org.apache.tomcat.maven</groupId>
<artifactId>tomcat7-maven-plugin</artifactId>
<version>2.1</version>
<configuration>
<port>9001</port>
</configuration>
</plugin>
6.如果使用的是struts,要在web.xml中,将struts的拦截器配置为:*.action
7.使用代码
$(function(){
$("body").css({visibility:"visible"});
$("#back").click(function(){
location.href = "promotion.html";
});
//初始化kindeditor编辑器
var editor;
KindEditor.ready(function(K) {
editor = K.create('#description', {
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'
],
uploadJson : '../../edit/jsp/upload_json.jsp',
fileManagerJson : '../../edit/jsp/file_manager_json.jsp',
allowFileManager : true
});
});
});