TinyMCE - Chrome 浏览器 - 无法像在 FF 中那样在 Chrome 中粘贴图像

Question

我正在使用TinyMCE WYSIWYG 编辑器控件，虽然可以在FireFox 中复制和粘贴图像片段，但在Chrome 中是不可能的。

我试过升级到TinyMCE 版本。4.0.16（以前是 3.5.8 版）仍然没有办法让它工作。

有没有人能够做到这一点？

这在 FireFox 中的外观示例：

提前致谢！

Answer 1

我找到了这个问题的解决方案，并且已经使用 Chrome v 47 进行了测试。以下是您必须执行的操作：

function pasteHandler(e) {
   var cbData;
   if (e.clipboardData) {
      cbData = e.clipboardData;
   } else if (window.clipboardData) {
      cbData = window.clipboardData;
   }

   if (e.msConvertURL) {
      var fileList = cbData.files;
      if (fileList.length > 0) {
          for (var i = 0; i < fileList.length; i++) {
              var blob = fileList[i];
              console.log("Image blob: " + blob);
              readPastedBlob(blob);
         }
     }
 }
 if (cbData && cbData.items) {
     if ((text = cbData.getData("text/plain"))) {
         // Text pasting is already handled
         return;
     }
     for (var i = 0; i < cbData.items.length; i++) {
         if (cbData.items[i].type.indexOf('image') !== -1) {
             var blob = cbData.items[i].getAsFile();
             readPastedBlob(blob);
         }
     }
 }

function readPastedBlob(blob) {
    if (blob) {
        reader = new FileReader();
        reader.onload = function(evt) {
            pasteImage(evt.target.result);
        };
        reader.readAsDataURL(blob);
    }
}

function pasteImage(source) {
    var image = "<img src='" + source + "' data-mce-selected='1'></img>";
    window.tinyMCE.execCommand('mceInsertContent', false, image);
}}

在tinyMCE的init方法中：

tinymce.init({
    selector: "textarea", // change this value according to your HTML
    paste_data_images: true,
    setup: function(editor) {
        editor.on('paste', pasteHandler)
    };
})