tinymce - 如何在 TinyMCE Editor 中插入按钮以在当前位置插入本地文件作为 RAW 图像？

Question

如何将自定义/默认按钮添加到 TinyMCE 编辑器，以便能够选择本地镜像并将其作为 RAW (BASE64) 图像插入到编辑器中的当前位置？

Answer 1

我刚刚从 this answer 尝试了这个.

window.onload = function () {
  document.getElementById("fileName").onchange = function () {
    var reader = new FileReader();
    reader.readAsDataURL(this.files[0]);
    reader.onload = function () {
      console.log(reader.result);
      document.getElementById("img").src = reader.result;
    };
    reader.onerror = function (error) {
      console.log('Error: ', error);
    };
  };
};

<input type="file" name="fileName" id="fileName" /><br />
<img src="https://dummyimage.com/250x75/000/fff.png&text=Select+an+Image" id="img" style="max-width: 250px; max-height: 75px;" />

使用上面的 URL(参见控制台或检查元素并找到 src)和 inserting an image at the current position , 您可以在当前插入符号的位置插入文档内部的图像。