就在最近，公司让我写一个背景，里面用了一个富文本编辑器。自从有了这篇丰富的文字，我就慢慢进入了一个坑。一开始不知道用什么编辑器，但是看了很多，最后选择了。网络编辑3。我个人觉得这个丰富的文字比较干净，有很多功能。

当我选择编辑的时候，我慢慢走进坑里，一步一个脚印。下一步是查看代码。

这是wangeditor。选择你喜欢的版本。我用了3

https://github.com/wangfupeng1988/wangEditor/releases

定义富文本编辑器

然后富文本出现了

然后就是图片上传代码。首先，在js中配置一些东西。

脚本var E=window.wangEditorvar编辑器=新E(' # elm 1 ')；editor . customconfig . uploadimgserver=' uploads . PHP '；//上传图片到服务器editor . custom config . upload文件名=' file//文件名为参数值editor . custom config . uploadimgheaders={//表头表头信息' accept' :' text/x-JSON'}//将图片大小限制为3m editor . custom config . uploadimg maxsize=3 * 1024 * 1024//默认为5m editor . custom config . uploadimg showbase64=false；//使用base64保存图片//editor . custom config . custom alert=function(info){//设置自己的提醒错误消息////info是需要提示的内容//alert('自定义提示：''上传图片失败，请重新上传')//}；editor . customconfig . debug=true；//默认情况下，是否打开调试为假。建议您打开它时可以看到错误。//editor . custom config . debug=location . href . indexof(' Wang editor _ debug _ mode=1 ')0；//从上面两个中选择一个。//图片将回显editor . custom config . uploadimghooks={ error : function(xhr，editor) {alert ('2:' xhr '请检查您的json格式是否正确，图片是否尚未上传')；//图像上传出错时触发。如果报告此错误，则表示文件尚未上传。直接看你的json信息。是否正确//xhr是XMLHttpRequst对象，editor是editor对象}，fail:function (xhr，editor，result){//如果这里出现错误，说明图片上传成功但没有在编辑器中回显。我在这里要做的是在原始json中添加一个url键(参数)。customInsert中也使用了这个参数//alert(' 1:' xhr，请检查你的json格式是否正确，图片上传了，但是没有回显')；}，success:function(xhr，编辑器，结果){ //Success不需要警报。当然，您可以使用console.log来查看您的json成功。//console . log(result)//insertimg(' https://ss0 . BD static.com/5 av1 bjqh _ q23 DCF/static/superman/img/logo/BD _ logo 1 _ 31 BDC 765 . png ')}，customInsert:函数(insertImg，result，editor){//console . log(result)；//上传图片并返回结果，自定义插入图片的事件(而不是编辑器自动插入图片！)//insertImg是插入图片的函数，editor是editor对象，result是服务器返回的结果。//例如，如果服务器返回的格式是{url: ' . '}，可以这样插入图片：insertImg(result . URL)；} };editor . customconfig . showlinkimg=true；//是否打开网络图片，默认打开。编辑器. create()/脚本

这些是javascript的配置代码。

详细的php代码在我的git里有兴趣的可以下载~

https://github.com/wjmGG/wangeditor3UploadForPHP.git

这样就完成了wangeditor3的图像上传。

这些都是本介绍的知识点。谢谢你的支持。