excel表格粘贴到网页的功能
背景
项目有表格功能,表格过大,一个一个填,过于麻烦。
需要从excel表复制的功能。
过程
监听paste事件,根据事件提供的clipboardData属性,获取数据。
根据换行符 \n 和tab符 \t ,处理数据,获得二维数组。
代码
1 this.$refs.commonSizeTable.addEventListener('paste', function (evt) {
2 // 阻止事件传播
3 let event = event || window.event;
4 if(event.preventDefault)
5 event.preventDefault()
6 if(event.returnValue)
7 event.returnValue=false
8
9 // 获取数据
10 let clipdata = evt.clipboardData || window.clipboardData
11 if(!clipdata) {
12 return;
13 }
14 const data = clipdata.getData('text/plain')
15 const tableArr = data.split('\n').map(ele => {
16 return ele.split('\t')
17 })
18
19 // tableArr, 二维数组
20 })
excel表格粘贴到网页的功能的更多相关文章
- 从 Excel 表格粘贴到 浏览器表格中
从 Excel 表格粘贴到 浏览器表格中 由于 Excel 用途广泛,所以在导入时用到很多. 但是更多人的喜欢使用复制粘贴. 在网上找了一圈有找到一个开源项目,可以将 Excel 粘贴到 HTML 中 ...
- excel 表格粘贴到word 显示不完整
左上角,十字点,右键,取消固定宽度即可:
- php网址显示excel表格内容
/** * excel表格内容在网页中显示 * * 首先需要下载PHPExcel 工具包 * 网址: http://phpexcel.codeplex.com/releases/view/119187 ...
- php 读取excel表格中的内容
<?php /** * excel表格内容在网页中显示 * * 首先需要下载PHPExcel 工具包 * 网址: http://phpexcel.codeplex.com/releases/vi ...
- 在网页中预览excel表格文件
项目需求在前端页面中实现预览excel表格的功能,上网了解之后大致总结为一下几种方法. 1.office文档转换为pdf,再转swf,然后通过网页加载flash进行预览 2.通过 xlsx.js,js ...
- excel表格中如何将内容粘贴到筛选后的可见单元格[转]
默认情况下,筛选后excel表格进行复制粘贴,会贴到隐藏的表格. 可以添加两个辅助列来完成操作:1.在筛选前在表格右边添加"辅助1"列,在第二行输入1,按Ctrl+鼠标左键往下拉到 ...
- 使用 EPPlus 封装的 excel 表格导入功能 (.net core c#)
使用 EPPlus 封装的 excel 表格导入功能 前言 最近做系统的时候有很多 excel导入 的功能,以前我前后端都做的时候是在前端解析,然后再做个批量插入的接口 我觉着这样挺好的,后端部分可以 ...
- 使用 EPPlus 封装的 excel 表格导入功能 (二) delegate 委托 --永远滴神
使用 EPPlus 封装的 excel 表格导入功能 (二) delegate 委托 --永远滴神 前言 接上一篇 使用 EPPlus 封装的 excel 表格导入功能 (一) 前一篇的是大概能用但是 ...
- mysql 表结构转excel表格
最近需要写文档,由于开发模式是先开发后写文档(不想吐槽...),数据库表结构什么的都搞好了,然后写文档的时候需要贴表结构,什么字段,类型,相关说明需要一一对应起来,数据库表10多张,字段又多,手动复制 ...
- 浏览器仿EXCEL表格插件 - 智表ZCELL产品V1.4发布
智表(zcell)是一款浏览器仿excel表格jquery插件.智表可以为你提供excel般的智能体验,支持双击编辑.设置公式.设置显示小数精度.下拉框.自定义单元格.复制粘贴.不连续选定.合并单元格 ...
随机推荐
- 接口测试中Groovy引擎的接入实现!
接口测试中Groovy可以作为上下游接口参数化传递的前置脚本和后置脚本使用,无缝衔接Java语法,groovy的引入对于动态参数化的设置方便很多. 其中核心部分就是接入groovy的引擎,下面介绍gr ...
- 爱科微AIC8800D80P Wi-Fi6模块驱动移植
1. 简介 开发环境Ubuntu20.04 目标平台:瑞芯微RK356X 目标平台内核版本:4.19.234 wifi模块型号:AIC8800D80P Wi-Fi6/BT5.0 2. 硬件 wifi模 ...
- ubuntu 使用tree打印树形结构
ubuntu 使用 tree 命令能打印目录结构 sudo apt-get install tree 安装后使用tree就行了 . ├── index.php ├── phpQuery │ ├── ...
- ArcGIS填补面图层的细小空白并删除主体部分外的零散部分
本文介绍在ArcMap软件中,基于消除面部件("Eliminate Polygon Part")工具,对矢量面要素的零碎.空洞区域加以删除,同时将游离于要素主体之外的部分剔除的 ...
- 一个包含了 50+ C#/.NET编程技巧实战练习教程
DotNetExercises介绍 DotNetGuide专栏C#/.NET/.NET Core编程技巧练习集:C#/.NET/.NET Core编程常用语法.算法.技巧.中间件.类库.工作业务实操练 ...
- Element-UI 调整
1.对话框 当打开的对话框页面元素众多,俨然一个iframe页面时,可以做2个优化: 滚动条:对话框去滚动,当对话框内容过多时,把滚动条控制在对话框内部,避免出现页面级的滚动条 标题栏:优化对话框标题 ...
- 全网最适合入门的面向对象编程教程:60 Python面向对象综合实例-传感器数据实时绘图器
全网最适合入门的面向对象编程教程:60 Python 面向对象综合实例-传感器数据实时绘图器 摘要: 本文将结合之前内容实现模拟一个传感器系统软件,包括三个线程:传感器线程生成数据并通过串口发送给主机 ...
- 教你自创工作流,赋予AI助理个性化推荐超能力
之前,我们已经完成了工作流的基本流程和整体框架设计,接下来的任务就是进入实际操作和实现阶段.如果有同学对工作流的整体结构还不够熟悉,可以先参考一下这篇文章,帮助你更好地理解和掌握工作流的各个部分: 本 ...
- git commit之后,如何撤销commit
git reset --soft HEAD^ 仅仅是撤回commit操作,您写的代码仍然保留. HEAD^的意思是上一个版本,也可以写成HEAD~1 如果你进行了2次commit,想都撤回,可以使用H ...
- 双语对照的 PDF 翻译工具「GitHub 热点速览」
在 OpenAI 举办的「12天12场」发布会上,ChatGPT 的多项新功能正式亮相,包括 GPT-o1 正式版和 ChatGPT Pro(200 美元/月).强化微调(Reinforcement ...