js剪切板复制的表格自动识别

效果图如下：

把excel里的表格数据粘贴到框内，自动识别数据，这个例子比较简单，只是提供个思路

代码如下：

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title>
</head><body><div id="box" contenteditable="true"style="width:600px;min-height:300px;text-align:justify ;margin:100px auto;border: 1px solid orange;"></div><button "getValue()">获取值</button><div id="tip" style="width:600px;min-height: 200px;margin: 20px auto;border:1px solid #ddd;overflow: scroll;"></div><script src="https://code.jquery.com/jquery-3.1.1.min.js"></script><script>document.querySelector('#box').addEventListener('paste', (e) => {e.preventDefault();e.stopPropagation();let paste = (e.clipboardData || window.clipboardData).getData('text/html');const selection = window.getSelection();if (!selection.rangeCount) return false;$('#box').html(paste);});var fontValue=['name','price','Code','num']function getValue(){var tableArr=$('#box tr')||[];var data=[];for( var i=0;i< tableArr.length;i++){var trtemp=tableArr[i];var obj={};var tdTemp=$(trtemp).find('td');for(var x=0;x< $(tdTemp).length;x++){//var removeSpace=$(tdTemp).eq(x).text().replace(/(^\s*)|(\s*$)/g,'')var removeSpace=$(tdTemp).eq(x).text().replace(/\s*/g,'')obj[fontValue[x]]=removeSpace}data.push(obj)}var str=JSON.stringify(data,undefined, 4);$('#tip').html('<pre>'+str+'<pre>');}</script>
</body></html>

js剪切板复制的表格自动识别相关推荐

好程序员web前端分享js剪切板Clipboard.js 使用
好程序员web前端分享js剪切板Clipboard.js 使用,clipboard.js是一个用来设置剪切板的库,小巧无依赖,但用法有点诡异,必须依赖一个DOM元素. 必须要与一个DOM元素相关联,并 ...
剪切板复制word图片是本地路径_如何将图片数学公式快速输入到Word中？
背景: 在日常科研.学习与工作中,我们可能需要使用到某些书籍.期刊或者规范上的公式,但是如果自己纯手打则会相当麻烦(数学系LaTeX高手请忽略),因此如果有工具能够解决这个问题,那真的是解决了一大痛点 ...
【转】远程桌面剪切板复制文件失效解决方法
[转]http://blog.sina.com.cn/s/blog_4b0137b00101d3ka.html 我有一台主机已经连续不关机几个月之久,纯做远程桌面使用.用的时候发现,一开始往往是没问题 ...
C++ Windows剪切板复制粘贴
复制 if (OpenClipboard()){HGLOBAL hGBClipboard;char *chBufferText;EmptyClipboard();hGBClipboard = Glob ...
C#使用剪切板复制程序
System.Collections.Specialized.StringCollection list = new System.Collections.Specialized.StringColl ...
js 复制图片到剪切板和 js复制文本到剪切板
js 复制图片到剪切板 <a href="javascript:;" id="copyQrcode" data-base=""> ...
一键复制android代码,兼容安卓和ios实现一键复制内容到剪切板
js兼容安卓和ios实现粘贴板一键复制 color: #000; background: #fff; overflow-y: scroll;-webkit-text-size-adjust: 100% ...
VSCode实用快捷键：复制粘贴内容不改变剪切板等
VSCode里面有很多快捷键,接下来我讲一些我认为最实用的,可以帮助萌新提高代码编写速度 1.快捷复制粘贴 · 会改变剪切板的复制 ctrl+c 光标定在那一行想复制的地方,直接Ctrl+c,然后直接 ...
html 一键复制 ios,兼容安卓和ios实现一键复制内容到剪切板
js兼容安卓和ios实现粘贴板一键复制 color: #000; background: #fff; overflow-y: scroll;-webkit-text-size-adjust: 100% ...

js剪切板复制的表格自动识别

js剪切板复制的表格自动识别相关推荐

最新文章

热门文章