复制word图文到富文本编辑器

Posted 2023-04-09

参考技术A 大部分富文本编辑器能做到还原word的文本格式，例如字体字号表格以及布局相关的要素还原。但普遍对图片的支持比较差，都需要手动点击图片上传按钮，然后在光标的当前位置，插入指定的图片。这样用户的体验就非常糟糕，为什么不能直接复制粘贴，一步到位呢？
其实，从富文本编辑器里还原word的图文内容是一件挺麻烦的事情。因为word里的超文本语法跟web的html语法并不一致，需要做大量的转码工作。

经过调研，发现TinyMCE有一款付费插件PowerPaste，能够完美的支持该功能。其原理是先将剪切板里的图片转换为Base64编码格式的图片，然后再插入到指定位置。

如果word里只有上面这一行简单的文字，我们用普通的富文本编辑器，得到的结果如下：

用PowerPaste得到的结果如下：

可以看出，PowerPaste得到的结果更加简洁，符合html语法。

稍微复杂的word文档，粘贴到普通富文本编辑器，得到的结果如下：

用PowerPaste得到的结果如下：

可以看出，PowerPaste插件能够完美的还原word图文。

如果需要频繁的从word、excel中拷贝带有图片的数据到富文本编辑器中，那么TinyMCE+PowerPaste插件是非常好的选择。

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

很多时候我们用一些管理系统的时候，发布新闻、公告等文字类信息时，希望能很快的将word里面的内容直接粘贴到富文本编辑器里面，然后发布出来。减少排版复杂的工作量。

下面是借用百度doc 来快速实现这个word 粘贴到 富文本编辑器里面

方法一：

工具/原料

百度doc
任意富文本编辑器，以UEDdito为例

方法/步骤

登录，http://word.baidu.com

点击右上角 导入文档，如图所示

导入后，系统会自动将word的内容加载进去。此时 点击右上角编辑，Ctrl+A复制所有内容

打开UEditor，Ctrl+V 粘贴，搞定~

注意事项

建议使用Chrome浏览器操作

方法二：
分享一个更为强大的控件，详细内容可参考我写的这篇文章：http://blog.ncmem.com/wordpress/2019/08/07/%e5%af%8c%e6%96%87%e6%9c%ac%e7%bc%96%e8%be%91%e5%99%a8%e7%b2%98%e8%b4%b4word%e5%86%85%e5%ae%b9/

讨论群：223813913