最近做畢業設計用了一個叫做kindeditor的文本編輯工具，相信很多人都用過，這貨和fckeditor差不多，個人感覺這個的皮膚更好看，而且對中文的支持更好，沒那么容易出現中文亂碼問題。下次記錄一下自己的簡單用法：
1，首先去官網下載http://www.kindsoft.net/
2，解壓之后如圖所示：
由於本人做的是用的是JSP，所以ASP,PHP什么的就用不上了，直接把那些去掉然后將整個文件夾扔進Myeclipse，如圖：
里面有個報錯，估計是我自己IDE的問題，沒有處理照常使用。
3，就可以開工寫JSP了，下面把自己的一個JSP的代碼貼出來，頁面代碼神馬的不太規范，湊合着當示例，能跑通就行;
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme() + "://"
+ request.getServerName() + ":" + request.getServerPort()
+ path + "/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" type="text/css" href="css/layout.css">
<link rel="stylesheet" href="kindeditor/themes/default/default.css" />
<link rel="stylesheet" href="kindeditor/plugins/code/prettify.css" />
<script charset="utf-8" src="kindeditor/kindeditor.js">
</script>
<script charset="utf-8" src="kindeditor/lang/zh_CN.js">
</script>
<script charset="utf-8" src="kindeditor/plugins/code/prettify.js">
</script>
<script>
KindEditor.ready(function(K) {
var editor1 = K.create('textarea[name="article.content1"]', {
cssPath : 'kindeditor/plugins/code/prettify.css',
uploadJson : 'kindeditor/jsp/upload_json.jsp',
fileManagerJson : 'kindeditor/jsp/file_manager_json.jsp',
allowFileManager : true,
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>
</head>
<body>
<div id="container">
<div id="header">
</div>
<div id="menu">
<ul>
<li>
<a href="main.jsp">首頁</a>
</li>
<li>
<a href="jsp/update_password.jsp">個人信息</a>
</li>
<li>
<a href="jsp/article_add.jsp">提交論文</a>
</li>
<li>
<a href="article_returnList.action">審批論文</a>
</li>
<li>
<a href="#">后台管理</a>
</li>
</ul>
</div>
<div id="mainContent">
<form name="example" method="post" action="article_add.action">
題目：
<input type="text" name="article.title">
<br />
內容：
<textarea name="article.content1" cols="100" rows="8"
></textarea>
<br />
<input type="submit" name="button" value="提交" />
(提交快捷鍵: Ctrl + Enter)
</form>
</div>
<div id="footer">
Copyright 2012 by Lai Xuansi.
</div>
</div>
</body>
</html>
4，給張上述代碼的效果圖，本人不太會做界面，湊合看：
5，關於數據庫和上傳本地圖片問題
Kindeditor對於上傳的圖片神馬的會默認保存在attached文件夾中，至於數據庫字段中存儲的只是圖片的地址，所以將內容讀取出來的時候，只要讀取數據庫字段中的內容就會自動將文本和圖片等一起顯示出來了，很好很強大！要注意的就是讀取數據庫出來之后要將地址轉換成HTML代碼才能正確顯示，這個工作很簡單，只要：<s:property value="article.content1" escape="false" />將escape="false" 就OK了。