ueditor富文本上传pdf并能实时预览

2018-09-10 16:00:24

1.ueditor的附件功能自带上传pdf功能。

        然而我使用的是github改装七牛版本的,缺提示  文件类型不允许


        这就尴尬了,通过文本搜素,也只能这样了,ueditor的js文件太大了,太复杂了。这个肯定是检测上传配置文件引起的。去看配置文件,发现页没啥问题。php error_log 打印配置项和路由,发现原来这个上传文件统一使用的uploadImg这个路由。

那就在上传图片的配置文件上放开了pdf上传。至此可以上传pdf了。


2.html进行pdf展示。(再放开插入html元素 iframe标签的前提下)

        虽然上传成功了,但是pdf是展现为附件的,这样就有点不好了。

        通过查看附件html代码,关键词搜索,然后去更改了插入pdf的地方。

        截取修改的代码。


for (i = 0; i < filelist.length; i++) {
    item = filelist[i];
    icon = iconDir + getFileIcon(item.url);
    title = item.title || item.url.substr(item.url.lastIndexOf('/') + 1);

    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>';
    }


}
me.execCommand('insertHtml', html);

    完美实现。

  • 2020-04-14 09:51:03

    package.json 字段说明

    package.json 有很多字段,也有很多官方字段,我们需要知道他们的具体是做什么的才能很好的运用

  • 2020-04-14 15:35:52

    caniuse前端兼容性检查和使用

    相信大家都曾用caniuse网站查询过css、js的一些兼容性问题,并且都从它反馈的兼容性数据中获益,让我们的线上项目更加稳定、和谐的跑在用户电脑里。不过对于caniuse页面上的一些细节,我们可能会感到困惑或者模棱两可,今天就带着大家一起来重新认识caniuse这个网站,并对它的原理和细节做些探究。

  • 2020-04-15 17:00:07

    export和import的理解,这一篇问扎根就够了

    在 ES6 之前,社区制定了一些模块加载方案,最主要的有 CommonJS 和 AMD 两种。前者用于服务器,后者用于浏览器。ES6 在语言标准的层面上,实现了模块功能,而且实现得相当简单,完全可以取代 CommonJS 和 AMD 规范,成为浏览器和服务器通用的模块解决方案。

  • 2020-04-15 21:14:13

    .d.ts与.ts的区别 .d.ts怎么用

    在TypeScript项目中直接引入Javascript包是不能使用的,因为包中缺少TypeScript类型声明,如果是自己写的包,可以考虑自己增加一个.d.ts类型声明文件,如果代码比较多或者使用的是第三方的包,自己写就比较麻烦了。第三方的包首先考虑找一个别人写好的声明文件,如果没有可以使用一些自动生成声明文件的工具。

  • 2020-04-17 09:27:38

    推荐一个老前端开发者的博客

    前端修炼场,首页标签大全greenSock前端研究VUE研究我们的作品flash技术探讨开发心得个人档案培训与招聘服务报价