Ueditor详细配置说明文档

百度富文本编辑框插件Ueditor详细配置说明文档

1.文档结构说明

文档结构说明：除custom.js和jquery.min.js外，其他ueditor下的文件都为ueditor(jsp)下载版，custom.js是为了方便页面引用，如下图所示。
custom.js内容如下：

页面引用一个custom.js就行

2、ueditor后端配置
2.1、添加ueditor 的jar包文件到项目WEB-INF/lib下(右键项目名称，properties->java build path->add jars->找到WEB-INF/lib的jar文件添加)

2.2、修改ueditor.config.js文件

这部分代码是网上找的，添加到ueditor.config.js头部

主要是这块代码
window.UEDITOR_HOME_URL = applicationPath+"/resources/ueditor/" ;
//http://localhost:8080/success/resources/ueditor/
//ueditor放在webapp/resources 下
意思就是通过这段拼接地址可以访问到项目的ueditor目录，
我项目名字是success，下载的ueditor放到了resources下，所以applicationPath+"/resources/ueditor/"
因为是项目配置了静态资源释放为

<mvc:resources mapping="/resources/**“location=”/resources/" />
所以我放在了resources下边，放别的地方也行，只要可以访问到就可以。
要是页面显示出错，无法访问。可以F12,看看浏览器请求的地址和自己实际想访问的地址差别在哪，调整applicationPath后连接的字符串
2.3、修改config.json

主要就是修改不同位置的类似属性，就是上传目录，预览前缀。

imageUrlPrefix
这个我设置成了项目根目录
imagePathFormat
这个设置上传到resources/upload/image
一开始设置了很多次目录都没有成功，最后全盘搜索已上传的图片名称，根据他那个实际上传目录纠正的。

这块不对可以慢慢调，其他上传文件、视频啥的也如法炮制。
3、前端调用
3.1 ueditor编辑页(ueditor.jsp)

第一步：头部引入自定义js;(js内容参看1)

第二部：定义一个div或者是别的什么标签，

第三部：初始化ueditor

这个时候就可以启动项目测试ueditor页面了，正常如下显示。

3.1.1可能出现的问题
这个时候出现错误的，就只有两个地方。
一是页面内容毫无样式可言，堆积在一起。F12可以看出，是ueditor.config.js里请求的路径错误。可以把报错url和自己项目ueditor文件的地址相对比着看，调整到可以访问到ueditor文件。
二是文本编辑会提示本地保存成功，图片类上传的会提示“GET URL…”404,这种就在全盘搜文件名就行，名字就在GET url里。
找到文件路径，结合jsp/config.js，把预览前缀或者是上传目录改改就行。
这两个问题都挺好调的，结合错误路径和实际路径就可以了。
3.1.2 获取编辑的文本内容

其他用法可参看ueditor/index.html
3.2 前端数据返显(ueditorshowcontent.jsp)

第一步 ：引入自定义js(js内容参看1)
第二步 ：定义一个

或者别的标签
第三步 ：初始化ueditor控件
第四步 ：从数据库获取已存的html类源码文件
第五步 ：文件返显在控件里
感觉已经很详细了,下班了。
补充说明一点：存储的content类型为longtext