ueditor批量上传word图片
图片的复制无非有两种方法,一种是图片直接上传到服务器,另外一种转换成二进制流的base64码
目前限chrome浏览器使用
首先以um-editor的二进制流保存为例:
打开umeditor.js,找到UM.plugins['autoupload'],然后找到autoUploadHandler方法,注释掉其中的代码。
加入下面的代码:
//判断剪贴板的内容是否包含文本
//首先解释一下为什么要判断文本是不是为空
//在ctrl+c word中的文字或者图片之后会返回1种(image/png)或者4种type(text/plain,text/html,text/rtf,image/png)类型的对象
//为了兼容4种格式的情况,做了如下的判断
//如下代码:e.originalEvent.clipboardData.items获得剪贴板的内容
//当粘贴了文本之后text是不为空的,同时也会返回当前文本的图片类型
//如果有文字的话不做任何的处理,如果只粘贴图片的话文本一定是空的,包括复制的桌面图片或者截图的图片
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 ) {
var blob = item.getAsFile();
getBase64(blob, function( base64 ) {
//sendAndInsertImage(base64,me); 上传到服务器
setBase64Image(base64,me);
});
//阻止默认事件, 避免重复添加;
e.originalEvent.preventDefault();
};
}
}
两个方法:
//执行插入图片的操作
function setBase64Image(base64,editor){
editor.execCommand('insertimage', {src: base64,_src: base64});
}
//获得base64
function getBase64(blob, callback) {
var a = new FileReader();
a.onload = function(e) {callback(e.target.result);};
a.readAsDataURL(blob);
};
效果展示:
详细内容可参考这篇文章:http://blog.ncmem.com/wordpress/2019/08/07/ueditor-word%e5%9b%be%e7%89%87%e4%b8%8a%e4%bc%a0/
ueditor批量上传word图片的更多相关文章
- KindEditor3.x-自动上传Word图片功能.
Chrome+IE默认支持粘贴剪切板中的图片,但是我要发布的文章存在word里面,图片多达数十张,我总不能一张一张复制吧?Chrome高版本提供了可以将单张图片转换在BASE64字符串的功能.但是无法 ...
- ajaxfileupload批量上传文件+图片尺寸限制
1.首先展示ajaxfileupload代码,在这里修改为批量上传 //ajaxfileupload不展示全部代码,这是修改前与修改后代码对比,目的是上传多个文件 createUploadForm: ...
- 个人永久性免费-Excel催化剂功能第102波-批量上传本地图片至网络图床(外网可访问)
自我突破,在100+功能后,再做有质量的功能,非常不易,相对录制视频这些轻松活,还是按捺不住去写代码,此功能虽小,但功课也做了不少,希望对真正有需要的群体带来一些惊喜. 背景介绍 图床的使用,一般是写 ...
- csdn的博客上传word图片
目前大部分的博客作者在用Word写博客这件事情上都会遇到以下3个痛点: 1.所有博客平台关闭了文档发布接口,用户无法使用Word,Windows Live Writer等工具来发布博客.使用Word写 ...
- 百度编辑器ueditor给上传的图片加入水印
百度编辑器本身是没有为上传图片加入水印的功能,想要在上传的时候加入图片水印,也非常easy.以 ueditor 1.2.6 为例.打开php文件夹以下的imageUp.php文件,查找"$i ...
- JEECMS-新闻内容中遍历批量上传的图片
[#list content.pictures as p] <li value="${p_index+1}"> <img src="${p.imgPat ...
- 请问如何上传带图片的word
Chrome+IE默认支持粘贴剪切板中的图片,但是我要发布的文章存在word里面,图片多达数十张,我总不能一张一张复制吧?Chrome高版本提供了可以将单张图片转换在BASE64字符串的功能.但是无法 ...
- 百度编辑器ueditor批量上传图片或者批量上传文件时,文件名称和内容不符合,错位问题
百度编辑器ueditor批量上传附件时,上传后的文件和实际文件名称错误,比如实际是文件名“dongcoder.xls”,上传后可能就成了“懂客.xls”.原因就是,上传文件时是异步上传,同时进行,导致 ...
- 编辑器直接word直接上传word里的图片
tinymce是很优秀的一款富文本编辑器,可以去官网下载.https://www.tiny.cloud 这里分享的是它官网的一个收费插件powerpaste的旧版本源码,但也不影响功能使用. http ...
随机推荐
- 使用HSI配置系统时钟
这里我就直接粘代码了.很简单.上节理解了 这也就能简单了. void HSI_SetSysClk( uint32_t RCC_PLLMul_x ) { __IO uint32_t HSIStatus ...
- mysql中的锁机制之概念篇
锁的概念 ①.锁,在现实生活中是为我们想要隐藏于外界所使用的一种工具. ②.在计算机中,是协调多个进程或线程并发访问某一资源的一种机制. ③.在数据库当中,除了传统的计算资源(CPU.RAM.I/O等 ...
- 2017 ACM-ICPC 亚洲区(西安赛区)网络赛 Coin 矩阵快速幂
Bob has a not even coin, every time he tosses the coin, the probability that the coin's front face u ...
- (二十五)JSP九大内置对象(转)
--转载自孤傲苍狼博客 一.JSP运行原理 每个JSP 页面在第一次被访问时,WEB容器都会把请求交给JSP引擎(即一个Java程序)去处理.JSP引擎先将JSP翻译成一个_jspServlet(实质 ...
- (五)Hibernate的增删改查操作(2)
接上一章节 HQL的预编译语句 HIbernate中的预编译与Spring的预编译的处理差不多. 1:使用标准的? 2:使用命名参数 2.1:使用名称逐个设置. 2.2:使用Map(k ...
- POJ2503(Babelfish)--简单字典树
思路:就是用一个字典树翻译单词的问题,我们用题目中给出的看不懂的那些单词建树,这样到每个单词的叶子结点中存放原来对应的单词就好. 这样查询到某个单词时输出叶子结点存的就行,查不到就"en&q ...
- 使用Lua编写Wireshark插件解析KCP UDP包,解析视频RTP包
前段时间写了一个局域网音视频通话的程序,使用开源 KCP 来实现可靠UDP传输. 通过研究发现KCP在发包时,会在数据包前面加上它自己的头.如果数据包较小,KCP可能会把多个数据包合成一个包发送,提高 ...
- 移动端适配flexible.js
npm install lib-flexible --save npm install px2rem-loader --save-dev
- 工作流引擎Activiti
背景: 在计算机尚未普及时,许多工作流程采用手工传递纸张表单的方式,一级一级审批签字, 工作效率非常低下,对于数据统计以及生成报表的功能,需要经过大量的手工操作才能实现. 随着电脑的普及,这些工作的参 ...
- Java面试容器,collection,list,set
1.容器指的是可以容纳其他对象的对象. 2.collection/set/list的联系和区别? (1)collection是Java集合顶级接口,存储一组不唯一,无序的对象: (2)list接口 ...