富文本编辑器（php）

Posted 2021-02-02 jierong

首先去ueditor的官网下载php版本的文件，网站地址：http://ueditor.baidu.com/website/download.html

然后解压出来 改名为ueditor 并放到项目文件中。

前端代码：

1、引入ueditor的相关文件

<script src="ueditor/ueditor.config.js"></script>
<script src="ueditor/ueditor.all.min.js"></script>
<script src="ueditor/lang/zh-cn/zh-cn.js"></script>

2、在body标签中放进该标签

<script type="text/plain" id="editor" name="Detail"></script>

name属性是为了php文件获取值，用$_POST[‘Detail‘]就可以了

3、配置一下该编辑器的属性，在script标签中

首先要获取id，自己设置 的id，在这里我自己弄了宽和高 ，有个滚动效果，并减少了工具栏的很多功能，因为我主要是图片上传

<script>

UE.getEditor(‘editor‘, {
   initialFrameWidth: 500, initialFrameHeight: 300, autoHeightEnabled: false,
   toolbars: [[‘fullscreen‘, ‘source‘, ‘undo‘, ‘redo‘, ‘simpleupload‘, ‘insertimage‘]]
});

</script>

 

ueditor的配置文件更改：

ueditor/php/config.json文件的imagePathFormat需要改为你自己项目保存图片的文件夹，比如我的就是"imagePathFormat": "/back/image/{filename}"

至于imageUrlPrefix这个配置项，php一般是不需要更改的

 

最后就是php文件了，就是form表单提交一样接受name属性就好了，$_POST[‘Detail‘]，然后就插入数据库。