ueditor在线编辑器的简单使用-上传图片
由于我的项目个人博客网站需要用到在线编辑器,百度的ueditor编辑器就是一个很好的编辑器。开始比较迷茫的使用,各种百度,没有我满意的答案,明明可以很简单的使用。
1.首先进入ueditor官网下载,这个很简单吧!这里可以下载:
https://ueditor.baidu.com/website/download.html 因为我用的javaweb,所以用的jsp
2.添加必要的配置。下载后解压出来的文件夹的名字是 ueditor1_4_3_3-utf8-jsp 这里面有个子文件夹叫 utf8-jsp 。
a.新建一个文件夹名字ueditor,然后把utf8-jsp文件里的所用东西复制到ueditor,然后把ueditor放到你的项目里。(我的是maven项目 )
当然了,要把ueditor > jsp > lib下的jar包复制到web-inf > lib里,maven项目直接依赖:
<dependency>
<groupid>com.gitee.qdbp.thirdparty</groupid>
<artifactid>ueditor</artifactid>
<version>1.4.3.3</version>
</dependency>
3.页面引入ueditor,引用两个必须的js文件:ueditor.config.js,ueditor.all.js,和实例化ueditor。
4.这是最容易报错的一步,请你首先找到 ueditor > jsp > controller.jsp,在controller.jsp添加一句
观察控制台输出了什么,我控制台输出的是:
/users/mac/work/ideaprojects/blog-system/blog-admin/target/blog-admin-1.0-snapshot/
说明了图上保存的路径在这里,再看看 ueditor > jsp > config.json,
imageurlprefix这个就是访问你项目的跟路径名,比如我的是:http://localhost:8080/admin/edit-blog.html,那么imageurlprefix的值就是admin了,然后找到控制台输出的/users/mac/work/ideaprojects/blog-system/blog-admin/target/blog-admin-1.0-snapshot/里面看看有没有blogimg文件夹,如果有就找到对应日期下的文件夹, 那么你的图片就插入成功了。但是显示不一定成功
5.做完这些工作,那么恭喜你ueditor就可以正常使用和上传图片了。
图片上传成功!
上一篇: Python批量计算遥感图像NDVI(归一化植被指数)
下一篇: 最简单的计算器编码!
推荐阅读
-
百度编辑器ueditor更改图片和附件上传路径的方法
-
TP3.2.3框架使用CKeditor编辑器在页面中上传图片的方法分析
-
html5使用Drag事件编辑器拖拽上传图片的示例代码
-
关于UEditor编辑器远程图片上传失败的解决办法
-
百度编辑器ueditor更改图片和附件上传路径的方法
-
TP3.2.3框架使用CKeditor编辑器在页面中上传图片的方法分析
-
UEditor编辑器自定义上传图片或文件路径的修改方法
-
关于富文本编辑器—UEditor(java版)的使用,以及如何将UEditor的文件/图片上传路径改成绝对路径
-
ueditor编辑器不能上传图片问题的解决方法
-
关于UEditor编辑器远程图片上传失败的解决办法_PHP