ueditor上粘贴从word中copy的图片和文字
图片的复制无非有两种方法,一种是图片直接上传到服务器,另外一种转换成二进制流的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中copy的图片和文字的更多相关文章
- 在百度ueditor上粘贴从word中copy的图片和文字 图片无法显示的问题
我这边从world 里面复制粘贴图片到编辑器中,它自动给我上传了,但是我是用的第三方的要设置一个token值,我找了很久,也没有找到应该在哪里设置这个上传的参数,如果是点击图片上传,我知道在dialo ...
- ueditor粘贴从word中copy的图片和文字 图片无法显示的问题
我司需要做一个需求,就是使用富文本编辑器时,不要以上传附件的形式上传图片,而是以复制粘贴的形式上传图片. 在网上找了一下,有一个插件支持这个功能. WordPaster 安装方式如下: 直接使用Wor ...
- word中批量修改图片大小的两个方法
前言: 对于把ppt的内容拷贝到word中: 对ppt的一页进行复制,然后粘贴到word中 如果要的是ppt运行过程中的内容,在qq运行的情况下,按Ctrl+Alt+A截屏,按勾,然后可以直接粘贴到w ...
- word中批量修改图片大小
一,在word中按alt+f11组合键,进入VBA模式二,在左边的工程资源管理器中找到你的word文档,在其上右键/添加/模块三,把下面代码复制,粘贴进去.四,更改数值, 改一下宽度和高度数值(10) ...
- [Word]中批量修改图片大小和缩放比例方法
最近小编遇到一个问题:需要将一篇厘米.打开.宏名起好了,单击"创建"进入.返回word,工具-宏-宏(或者直接按Alt+F8),再次进入宏的界面,选择刚才编辑好的宏,并单击&quo ...
- WORD中无损复制图片
问题 默认 Ctrl+C复制出来图片图片的严重模糊,复制出来的不是原图片!因为图片尺寸被修改后复制出来的则是模糊的 解决办法 解决办法把WORD中的图片恢复成默认的,如果对图片进行了缩放请把缩放比恢复 ...
- Winform DataGridView列的单元格中动态添加图片和文字
先上图在说,第二列中图片和文字的样式 1.需要重写DataGridViewTextBoxColumn,新建类TextAndImageColumn.cs using System; using Syst ...
- word----遇到问题-----word中插入的图片无法左对齐----格式按钮为灰色
当我们在用word时,有时要插入图片,却发现,插入的图片只在中间位置,不能拖到左边,这时怎么办呢 主要是图层的高低原因导致的不能拖动. 这个时候我们只需要设置一下图片的图层类型即可. 对着图片右键在设 ...
- word 加载adobe acrobat ,保存word中的清晰图片
1:先安装 adobe 并激活 https://blog.csdn.net/xintingandzhouyang/article/details/82558235 2:打开word,点击 文件&g ...
随机推荐
- (十六)JDBC 处理大数据
目录 前言: 基本概念 对于Mysql的Text类型 流地址的写法 blob类型数据 备注 前言: 在实际开发中,程序需要把 大文本或二进制 数据保存到数据库中: 实际上,我们并不存储大的数据到数据库 ...
- Asp.net core 学习笔记 Node Service
我们知道 npm 是很大的库,很多轮子可以用 所以 .net core 替我们封装了一个调用 nodejs 的 service 就叫 node service 我们只要在 server 安装 node ...
- 怎样设置Cookie
因为 Cookie 是服务器保存在浏览器中的一小段信息, 因此这个设置应当是服务器发起的, 设置方法是在Response Header中添加: Set-Cookie字段, 值是多个键值对. 如下: / ...
- 常用javascript对象——Date对象
创建 Date 对象的语法: new Date(); 1:Date 对象属性 <!DOCTYPE html> <html> <head> <meta char ...
- vue + echarts 实现中国地图 展示城市
Demo 安装依赖 vue中安装echarts npm install echarts -S 在main.js中引用 import echarts from 'echarts'Vue.prototyp ...
- 关于Highcharts数据量超过1000时无法显示问题
今天在vue的项目中引入Highcharts,想做一个大数据量的实时刷新曲线图,发现当数据量超过1000就无法显示. 经过排查发现 Highcharts为了保证更好的性能设置了一个性能阈值检查,当数据 ...
- parseInt parseFloat Number三者转换的方式
1.parseInt:从左到右检测字符串,若能先检测到数字,则将数字转换成整形,否则返回NaN. 2.parseFloat:从左到右检测字符串,若能先检测到数字,则将数字转换成浮点型,否则返回NaN. ...
- Java秒杀实战 (六) 服务级高并发秒杀优化(RabbitMQ+接口优化)
转自:https://blog.csdn.net/qq_41305266/article/details/81146716 一.思路:减少数据库访问 1.系统初始化,把商品库存数量加载到Redis 2 ...
- 【jekins】jenkins构建触发
一.定时构建的语法 * * * * *(五颗星,中间用空格隔开)第一颗*表示分钟,取值0~59第二颗*表示小时,取值0~23第三颗*表示一个月的第几天,取值1~31第四颗*表示第几月,取值1~12第五 ...
- scrapy 增量采集
在做新闻或者其它文章采集到时候,只想采集最新发布的信息,之前采集过得就不要再采集了,从而达到增量采集到需求 scrapy-deltafetch,是一个用于解决爬虫去重问题的第三方插件. scrapy- ...