• 如何从word文档复制公式到web编辑器


    图片的复制无非有两种方法,一种是图片直接上传到服务器,另外一种转换成二进制流的base64码
    目前限chrome浏览器使用
    首先以um-editor的二进制流保存为例:
    打开umeditor.js,找到UM.plugins['autoupload'],然后找到autoUploadHandler方法,注释掉其中的代码。
    加入下面的代码:

    //判断剪贴板的内容是否包含文本

    //首先解释一下为什么要判断文本是不是为空

    //在ctrl+c word中的文字或者图片之后会返回1种(image/png)或者4种type(text/plain,text/html,text/rtf,image/png)类型的对象

    //为了兼容4种格式的情况,做了如下的判断

    //如下代码:e.originalEvent.clipboardData.items获得剪贴板的内容

    //当粘贴了文本之后text是不为空的,同时也会返回当前文本的图片类型

    //如果有文字的话不做任何的处理,如果只粘贴图片的话文本一定是空的,包括复制的桌面图片或者截图的图片

    var text = e.originalEvent.clipboardData.getData("text");

    if(text == ""){

        var items=e.originalEvent.clipboardData.items;

         for (var i = 0, len = items.length; i < len; i++) {

            var item = items[i];

           if ( item.kind == 'file' && item.type.indexOf('image/') !== -1 ) {

             

                  var blob = item.getAsFile();

                  getBase64(blob, function( base64 ) {

                  //sendAndInsertImage(base64,me); 上传到服务器

                   setBase64Image(base64,me);

                  });

                  //阻止默认事件, 避免重复添加;

                  e.originalEvent.preventDefault();

                 };

            }

    }

    两个方法:

    //执行插入图片的操作

    function setBase64Image(base64,editor){

        editor.execCommand('insertimage', {src: base64,_src: base64});

    }

    //获得base64

    function  getBase64(blob, callback) {

        var a = new FileReader();

        a.onload = function(e) {callback(e.target.result);};

        a.readAsDataURL(blob);

    };

    效果展示:

    详细内容可参考这篇文章:http://blog.ncmem.com/wordpress/2019/08/07/ueditor-word%e5%9b%be%e7%89%87%e4%b8%8a%e4%bc%a0/

    讨论群:223813913

  • 相关阅读:
    OS + Multipass
    服务器间文件实时双向同步(rsync+inotify)
    全链路追踪 & 性能监控工具 SkyWalking 实战
    TCP Dup ACK linux kernel 3.2
    Ns3.35 errata Compilation on Python 3.10 systems
    LeetCode 108. Convert Sorted Array to Binary Search Tree
    LeetCode 98. Validate Binary Search Tree
    LeetCode 701. Insert into a Binary Search Tree
    LeetCode 235. Lowest Common Ancestor of a Binary Search Tree
    LeetCode 783. Minimum Distance Between BST Nodes
  • 原文地址:https://www.cnblogs.com/songsu/p/13209539.html
Copyright © 2020-2023  润新知