kindeditor的简单尝试 maven项目

刚刚毕业，在工作上遇到了很多问题。这里把我尝试kindeditor编辑器的过程和大家分享一下，希望和我一样的新人可以有所收获，也希望大牛们多多指点

kindeditor官网http://kindeditor.net/

下载并解压，保留自己需要的部分，我用的是jsp

将文件夹复制到项目里

kindeditor/jsp中的file_manager_json.jsp中

//根目录路径，可以指定绝对路径，比如 /var/www/attached/
String rootPath = pageContext.getServletContext().getRealPath("/") + "/static/kindeditor/attached/";
//根目录URL，可以指定绝对路径，比如 http://www.yoursite.com/attached/
String rootUrl  = request.getContextPath() + "/static/kindeditor/attached/";

upload_json.jsp中

//文件保存目录路径
String savePath = pageContext.getServletContext().getRealPath("/") + "/static/attached/";

//文件保存目录URL
String saveUrl  = request.getContextPath() + "/static/attached/";

在相应的jsp引入js和css

然后是

	<script>
		KindEditor.ready(function(K) {
			var editor1 = K.create('textarea[name="content"]', {
				cssPath : 'static/kindeditor/plugins/code/prettify.css',
				uploadJson : 'static/kindeditor/jsp/upload_json.jsp',
				fileManagerJson : 'static/kindeditor/jsp/file_manager_json.jsp',
				allowFileManager : true,
				  allowImageUpload : true, 
			//	imageUploadJson:'static/kindeditor/jsp/upload_json.jsp',
				afterCreate : function() {
					var self = this;
					K.ctrl(document, 13, function() {
						self.sync();
						document.forms['example'].submit();
					});
					K.ctrl(self.edit.doc, 13, function() {
						self.sync();
						document.forms['example'].submit();
					});
				}
			});
			prettyPrint();
		});
	</script>

在想要显示的地方添加

 	<textarea name="content" cols="100" rows="8" style="width:700px;height:200px;visibility:hidden;"></textarea>

基本就是这样。

在实际操作的时候可能出现了一个问题：页面上只有一个多行文本框。那么可能是js和css没引入成功。我建议直接把js和css从项目的相应位置拖到script里面，我的spring-mvc.xml文件中是这样配的 <mvc:resources mapping="/static/**" location="/static/" /> 所以我的js和css路径是从static开始的。

如果要传入数据库只要再加一个content就好了

Controller

@RequestMapping(value="addd")

public String addd(User user,String name,int age,String nice_name,String content){
	
	user.setName(name);
	user.setAge(age);
	user.setNice_name(nice_name);
user.setContent(content);
	usersService.ADD(user);

总结一下，kindeditor很好用，只要路径对了基本就可以成功。