java jsp使用百度的ueditor html编辑器

首先先到百度搜索ueditor 然后进入官网去下载jsp版本的  jsp有两个版本 一个是utf-8和jbk两种，我下载的utf-8 这个根据自己的项目采用的字符集决定使用什么版本，废话不多说了现在开始使用百度的ueditor编辑器。

第一步先把下载好的ueditor放进项目当中，jsp文件下面的lib是我们要用到的jar包，直接丢到web-inf下面的lib下面去，因为项目会使用到这些jar包，然后自己新建一个jsp页面，导入ueditor.config.js和ueditor.all.min.js这两个文件，

第二步把ueditor 渲染页面去，因为我需要把ueditor 的数据传到后台保存到数据库，此时我们应该先创建一个form表单，ueditor 的文档当中也提到，接下来在form表单当中写入

<script type="text/javascript">
var editor = new baidu.editor.ui.Editor();
editor.render('myEditor');
</script>
<script type="text/javascript">
$(function(){
UE.getEditor('myEditor');
});
</script>
<textarea id="myEditor"></textarea>

这时ueditor 会渲染到textarea 这里面

现在可以访问自己的页面可以看到效果了，我这边因为是使用ajax提交表单所以还得导入jquery-1.10.2.js和jquery-1.10.2.min.js这两个文件

在form里面定义一个按钮，然后访问自己写的js

ajax  js代码如下      

$.ajax({
                    type: "POST",
                    dataType: "html",
                    url: rootPath+'/tclassschedule/getTree',
                    data: $('#formPost').serialize(),
                    success: function (result) {
                        var strresult=result;
                      
                       
        editor.ready(function(){
   editor.setContent(strresult);    
})
                        
                   
                      //  $("#spanMaxAmount").html(strresult);
                    },
                    error: function(data) {
                        alert("error:"+data.responseText);
                     }


                });

   前台会传一个参数  editorValue   后台获取到这个直接保存到数据库就可以了  

ueditor访问后台读取数据库把内容显示到编辑器 这时用ajax访问 然后把接收到的参数  通过这个方法放到编辑器里面就可以了

editor.ready(function(){
     editor.setContent(strresult);    
})

图1  alert的内容是保存数据库的内容，然后用ajax获取，图2是获取数据放到编辑器里面的