百度编辑器不止可以上传图片和文字，还可以上传文件，但是文件是当成附件来显示的，并不可以直接显示文件的内容，就像下面：
附件显示
这样子来说，对于PDF的文件支持性就不是很好了，所以，可以稍微改造一下，让其可以直接显示我们上传的PDF文档的内容
首先，得解决上传文件的问题，附件的上传按钮如下图：
附件按钮
点击以后，可以上传文件，也可以在已上传的文件中选择：
上传文件
已上传的文件
假如没有这个按钮，则可以去看看是否生成编辑器的时候隐藏了此工具，如果是直接实例化的编辑器，可以在 ueditor 下的 ueditor.config.js 文件里找一下下图，看看是否有此工具：attachment
ueditor.config.js
同样的，假如是在配置ueditor的时候写过工具栏，可以看看是否有在工具栏里加了这个，这个就不贴图了。
默认来说，附件的上传都会允许PDF的文件格式，但假如不支持，打开 ueditor/php/config.json 进行配置的修改添加
config.json
上传图片和文件的功能我就不在这里重复了，网上都有，或者看看我之前上传的文档 tp5插入百度富文本编辑器UEditor
接下来是重点，修改 ueditor.all.js 文件，重新编写上传PDF文档后的html，搜索：插入附件
ueditor.all.js
并修改代码：
if(title.indexOf("pdf")>0){
html +='<iframe style="width: 100%;height: 600px;border: 0px;overflow: hidden" width="100%" height="500px" src="'+item.url+'"></iframe>';
}else{
html += '<p style="line-height: 16px;">' + '<img style="vertical-align: middle; margin-right: 2px;" src="'+ icon + '" _src="' + icon + '" />' + '<a style="font-size:12px; color:#0066cc;" href="' + item.url +'" title="' + title + '">' + title + '</a>' + '</p>';
}
ueditor.all.js
这样还不行，ueditor编辑器是会屏蔽 iframe 标签的，所以，我们得把 iframe 标签加入白名单，白名单的操作也在 ueditor.config.js 里
ueditor.config.js
添加这行代码，，[ ]里是 iframe 标签的属性值，你可以看着修改
iframe: ['src', 'width', 'height', 'style'],
一切都修改好了以后，别忘了保存并清除浏览器的缓存，接着，就是见证奇迹的时刻！！
PDF
资料参考自：http://quanzhan.applemei.com/webStack/TWpBME9RPT0=
以上。
网友评论