Ueditor 从word中复制内容带多张图片

版权所有 2009-2020 荆门泽优软件有限公司

保留所有权利

官方网站:http://www.ncmem.com/index.aspx

产品首页:http://www.ncmem.com/webapp/wordpaster/index.aspx

开发文档:http://www.ncmem.com/doc/view.aspx?id=29adc89a08ed489498160458cddfa51b

控件下载:http://www.ncmem.com/webapp/wordpaster/pack.aspx

示例下载:http://www.ncmem.com/webapp/wordpaster/versions.aspx

联系信箱:1085617561@qq.com

联系QQ:1085617561
产品交流群:泽优Word一键粘贴控件
扫码加群:

说明:UEditor1.4x示例中编辑器版本已经升级到ueditor-1.4.3.3,请下载最新的示例。

1.1. 集成到UEditor1.x

说明:

1.wordpaster以插件形式集成到ueditor中,不会对ueditor原有功能造成影响。当不需要wordpaster功能时可以直接卸载。

2.wordpaster使用的上传页面是一个单独的页面,和ueditor官方demo中的上传页面不是同一个页面。

3.wordpaster与ueditor版本无关,可支持多个版本。

4.wordpaster是基于插件技术实现的功能,使用前需要安装插件。

 

项目:
1.复制目录:WordPaster
ueditor1.4x示例中,wordpaster插件JS采用更加合理的方式实现了插件,不需要再修改ueditor的任何代码,请下载ueditor1.4x示例使用。

  http://bbsres2.ncmem.com/a8898205.png

2.配置上传接口地址(PostUrl)
  
  示例中上传接口默认返回的数据是图片的完整路径。如:http://www.ncmem.com/test.jpg

  如果您的上传接口返回JSON数据请修改ImageMatch配置,参考:http://www.ncmem.com/doc/view.aspx?id=07e3f323d22d4571ad213441ab8530d1
  如果您的上传接口有SESSION验证,则请配置COOKIE,参考:http://www.ncmem.com/doc/view.aspx?id=8602DDBF62374D189725BF17367125F3

整合后的效果:
    整合后,在工具栏中会多出两个图标按钮。

    

 

1.1.7. 添加到右键菜单

aea98f57-4f17-4b28-a20d-af9f58470d7d

bfd165b2-2ed2-437e-ac9d-cd5b60aa56cf

集成后的效果:

033b5a17-b98d-4879-aff3-e3457cacf0f3

 

1.1.8. 自定义Ctrl+V快捷键

 
页面:
1.在引用页面增加头文件和插件初始化代码

<html xmlns=”[url]http://www.w3.org/1999/xhtml”>[/url]

<head>

    <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″/>

    <script type=”text/javascript” src=”ueditor.config.js” charset=”utf-8″></script>

    <script type=”text/javascript” src=”ueditor.all.min.js” charset=”utf-8″></script>

    <link type=”text/css” rel=”Stylesheet” href=”WordPaster/WordPaster.css”/>

    <link type=”text/css” rel=”Stylesheet” href=”WordPaster/js/skygqbox.css” />

    <script type=”text/javascript” src=”WordPaster/js/json2.min.js” charset=”utf-8″></script>

    <script type=”text/javascript” src=”WordPaster/js/jquery-1.4.min.js” charset=”utf-8″></script>

    <script type=”text/javascript” src=”WordPaster/js/w.edge.js” charset=”utf-8″></script>

    <script type=”text/javascript” src=”WordPaster/js/w.app.js” charset=”utf-8″></script>

    <script type=”text/javascript” src=”WordPaster/js/w.file.js” charset=”utf-8″></script>

    <script type=”text/javascript” src=”WordPaster/js/skygqbox.js” charset=”utf-8″></script>

    <script type=”text/javascript” src=”WordPaster/js/w.js” charset=”utf-8″></script>

</head>

<body>

     <textarea name=”后台取值的key” id=”myEditor”>这里写你的初始化内容</textarea>

     <script type=”text/javascript”>

        var pasterMgr = new WordPasterManager();//这里必须声明成全局变量。

         pasterMgr.Config[“PostUrl”] = “http://localhost:1761/upload.aspx”;//可以直接使用UEditor的上传地址,

         pasterMgr.Load();//加载控件

        

         UE.getEditor(‘myEditor’,{onready:function(){

              pasterMgr.SetEditor(this);

         }});

     </script>

</body>

</html>


UEditor后端配置说明:
  http://fex.baidu.com/ueditor/#server-config
 

说明:

WordPasterManager必须申明成全局变量

23d6cb43-00b3-4b0b-98e1-0542e9d98a75

 批量粘贴效果:

自动替换编辑器中的图片地址:在上传多张图片时非常方便,也非常高效。

图片保存路径:

 

常见问题:

1.为什么整合到项目中图片无法上传?

可能原因:可能上传页面有登陆验证,上传时没有添加SESSION信息,导致上传失败。可在上传页面增加SESSION参数。

 

2.整合后无法粘贴图片

可能原因:http://www.ncmem.com/doc/view.aspx?id=305840a72ab142378b3960b6a224bd75