在JavaWeb项目中添加富文本编辑器------UEditor的使用
一、 目的:在 jsp 页面引用 UEditor 编辑器 二、步骤:
- 在链接: .中选择下载
- 将下载下来的的压缩包解压获得的文件夹拷贝到JavaWeb项目下的WebContent(Eclipse开发环境中)
- 将导入到项目中的文件夹 utf-8 中的 jsp 文件夹中的 lib 文件夹中的 jar 导入到项目中的 lib 文件夹中,记得 bilder path
- 在浏览器地址栏输入: 若出现如下页面,说明基本配置完成
- 配置资源所在根路径,配置文件路径 /utf8-jsp/ueditor.all.min.js :
- 配置图片上传的路径,配置文件的路径为 /utf8-jsp/jsp/config.json:将红笔圈出的位置替换成你的项目名称
7. 在 jsp 页面中显示 UEditor 编辑器: ①在要显示的 UEditor 编辑器的 jsp 页面上引入以下 js 文件:
<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath}/utf8-jsp/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath}/utf8-jsp/ueditor.all.min.js"> </script>
<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath}/utf8-jsp/lang/zh-cn/zh-cn.js"></script>
content 是文本域的名字
<script type="text/javascript">
var ue = UE.getEditor(content);
</script>
②把需要显示 UEditor 编辑器的代码添加到相对应的地方:
<textarea name="content" id="content" style="width: 916px; height: 400px; margin: 0 auto;"></textarea>
