KindEditor
UEditor：百度编辑器
http://ueditor.baidu.com/website/
CKEditor
纯js开发，跟后台语言没有关系。
使用方法
第一步：在jsp中引入KindEditor的css和js代码
1 <link href="kindeditor-4.1.10/themes/default/default.css" type="text/css" rel="stylesheet"> 2 <script src="jquery-1.10.1.min.js"></script> 3 <script type="text/javascript" charset="utf-8" src="kindeditor-4.1.10/kindeditor-all-min.js"></script> 4 <script type="text/javascript" charset="utf-8" src="kindeditor-4.1.10/lang/zh_CN.js"></script>
第二步：在表单中添加一个textarea控件。是一个富文本编辑器的载体。类似数据源。
1 <form action="editor.html" method="post"> 2 <textarea style="800px;height:300px;visibility:hidden;" name="desc" id="editor"></textarea> 3 <input type="submit"/> 4 </form>
第三步：初始化富文本编辑器。使用官方提供的方法初始化。
1 <script type="text/javascript" > 2 var kingEditorParams ={ 3 filePostName : "file",//指定上传文件参数名称 4 uploadJson:'upload2.html',//指定上传文件请求的url。 5 dir:"image"//上传类型，分别为image、flash、media、file 6 } 7 var editor; 8 $(function () { 9 editor=KindEditor.create($("#editor"),kingEditorParams); 10 }) 11 </script>
js提交请求的时候，同步富文本框到textarea
1 editor.sync();//同步富文本编辑器到textarea
上传图片时controller方法：
1 @ResponseBody 2 String json = "{"error":0,"url":"" + url + ""}";