参考:http://blog.ncmem.com/wordpress/2019/08/07/word%e5%9b%be%e7%89%87%e4%b8%8a%e4%bc%a0%e5%88%b0%e6%9c%8d%e5%8a%a1%e5%99%a8/

转载后,简单改编为支持自动上传到服务器

umeditor.js下面代码中:

me.addListener('ready', function () {

if (window.FormData && window.FileReader) {

var autoUploadHandler = function (e) {

debugger;

var hasImg = false,

items;

//获取粘贴板文件列表或者拖放文件列表

items = e.type == 'paste' ? getPasteImage(e.originalEvent) : getDropImage(e.originalEvent);

if (items) {

var len = items.length,

file;

while (len--) {

file = items[len];

if (file.getAsFile) file = file.getAsFile();

if (file && file.size > 0 && /image\/\w+/i.test(file.type)) {

sendAndInsertImage(file, me);

hasImg = true;

}

}

if (hasImg) return false;

}

else{

// word里面的图片不会当做图片,而是text/plain, 用getPasteImage 获取不到

/ /todo 目前只是支持单个图片,不包含文字的,支持图片的,需要再修改下代码。稍等。

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 ) {

if (item.getAsFile) file = item.getAsFile();

var blob = item.getAsFile();

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

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

e.originalEvent.preventDefault();

};

}

}

}

};

me.getOpt('pasteImageEnabled') && me.$body.on('paste', autoUploadHandler);

me.getOpt('dropFileEnabled') && me.$body.on('drop', autoUploadHandler);

//取消拖放图片时出现的文字光标位置提示

me.$body.on('dragover', function (e) {

if (e.originalEvent.dataTransfer.types[0] == 'Files') {

return false;

}

});

}

});

word图片上传到服务器的更多相关文章

  1. ckeditor如何能实现直接粘贴把图片上传到服务器中?

    在之前在工作中遇到在富文本编辑器中粘贴图片不能展示的问题,于是各种网上扒拉,终于找到解决方案,在这里感谢一下知乎中众大神以及TheViper. 通过知乎提供的思路找到粘贴的原理,通过TheViper找 ...

  2. MVC图片上传、浏览、删除 ASP.NET MVC之文件上传【一】(八) ASP.NET MVC 图片上传到服务器

    MVC图片上传.浏览.删除   1.存储配置信息 在web.config中,添加配置信息节点 <appSettings> <add key="UploadPath" ...

  3. php form 图片上传至服务器上

    本文章也是写给自己看的,因为写的很简洁,连判断都没有,只是直接实现了能上传的功能. 前台: <form action="upload.php" method="PO ...

  4. 使用canvas给图片添加水印, canvas转换base64,,canvas,图片,base64等转换成二进制文档流的方法,并将合成的图片上传到服务器,

    一,前端合成带水印的图片 一般来说,生成带水印的图片由后端生成,但不乏有时候需要前端来处理.当然,前端处理图片一般不建议,一方面js的处理图片的方法不全,二是有些老版本的浏览器对canvas的支持度不 ...

  5. java+Word图片上传控件

    这种方法是servlet,编写好在web.xml里配置servlet-class和servlet-mapping即可使用 后台(服务端)java服务代码:(上传至ROOT/lqxcPics文件夹下) ...

  6. 根目录97 <input file>标签,把图片上传到服务器(跟增删改查一起实现)

    首先来个简单的html页面: enctype="multipart/form-data" encoding="multipart/form-data" acti ...

  7. ueditor+word图片上传

    最近公司做项目需要实现一个功能,在网页富文本编辑器中实现粘贴Word图文的功能. 我们在网站中使用的Web编辑器比较多,都是根据用户需求来选择的.目前还没有固定哪一个编辑器 有时候用的是UEditor ...

  8. Express+MySQL实现图片上传到服务器并把路径保存到数据库中

    demo准备:mysql5.7.20 express4.0 处理图片文件的中间件Multer 先搭建服务器并展示html页面 const express = require("express ...

  9. hbuilder mui uploader图片上传到服务器完整版(ASP.NET)

    html布局,比较简单,模仿微信的: <div class="dynamic_images"> <ul> <!--<li><img  ...

随机推荐

  1. go hello world第一个程序

    main 函数所在的包名必须使用main import "fmt"  导入包fmt  fmt包包含了Println方法的定义 func main() 程序运行入口方法和c语言相似 ...

  2. 【BFS】斗地主

    斗地主 题目描述 众所周知,小 X 是一个身材极好.英俊潇洒.十分贪玩成绩却依然很好的奆老.这不,他又找了他的几个好基友去他家里玩斗地主了……身为奆老的小 X 一向认为身边人和自己一样的厉害,他坚信你 ...

  3. 再谈 pm2

    比forever好用,对Ubuntu和centos更友好,性能监控.自动重启.负载均衡,适用于laas场景, 总之,pm2是一个带有负载均衡功能的Node应用的进程管理器,可以实现在云服务器上,对no ...

  4. win7 bios引导启动Ubuntu

    用easyBCD修改系统启动项更改 1.安装easyBCD后打开,点击“Add New Entry”>选择Linux/BSD:具体设置如图,Type选择GRUB2,Name自己随便写,笔者写的是 ...

  5. Mysql基础学习_Windows版(一)

    1.Mysql简介 Mysql是一种关系数据库管理系统,关系数据库将数据保存在不同的表中,而不是将所有数据放在一个大仓库内,这样就增加了速度并提高了灵活性.所谓的关系型数据库,是建立在关系模型基础上的 ...

  6. printPreviewControl1怎么刷新文档

    printPreviewControl1.InvalidatePreview(); 调用printPreviewControl1控件的  InvalidatePreview() 这个方法即可.

  7. 【ASE模型组】Hint::neural 模型与case study

    模型 基于搜索的提示系统 我们的系统用Pycee针对语法错误给出提示.然而,对于语法正确.结果错误的代码,我们需要另外的解决方式.因此,我们维护一些 (错误代码, 相应提示) 的数据,该数据可以由我们 ...

  8. Spring3.2.2中相关Jar包的作用

    今天在看Spring的源码的时候不知道从什么地方开启应该合适,因为不太清楚实现类所在的具体Jar包,就从网上找了些,可是网上有的说的是不清不楚,甚至是有些错误的,所以就把相关Jar包的大致作用给整理了 ...

  9. 使用了frame的页面如何整体进行跳转,而不是仅frame跳转

    使用了frame的页面如何整体进行跳转,而不是仅frame跳转 js window.parent.location.href="你的地址"; php echo "&quo ...

  10. git日常命令

    克隆项目:git clone addr dir 切换分支,分支并没有 git checkout -b production origin/production 分支已存在,单纯切换分支 git che ...