excel数据复制到html表格<textarea>中
方案一
多行文本框接收到复制的excel值后,在文本框的chage事件中,将excel内容分割到二维数组中,然后填充到html的表格的input或textarea中。
数据格式: 单元格复制后的数据格式为"设备\t缺陷类型\r\n水压堵阀\t母材裂纹"。
注释:单元格之间通过"\t"分隔,行间通过"\r\n"分隔。数据必须粘贴到<textarea>多文本框中,如果是<input>控件换行符"\r\n"会被删除掉。表格中要使用<textarea>接收数据,
$(function () {
$("textarea").on("change", function () {
var str = $(this).val();
var rowStrArray = str.split("\n");
var rows = [];
for (var i = 0; i < rowStrArray.length; i++) {
var row = [];
var tdStrArray = rowStrArray[i].split('\t');
for (var j = 0; j < tdStrArray.length; j++) {
row.push(tdStrArray[j]);
}
rows.push(row);
} var startTr = $(this).parents("tr:first");
var startTd = $(this).parents("td:first");
var trIndex = -1;
var tdIndex = -1;
$("tr").each(function (i, tr) {
if (tr == startTr[0]) {
trIndex = i;
} $(tr).find("td").each(function (j, td) {
if (td == startTd[0]) {
tdIndex = j;
} if (trIndex != -1 && tdIndex != -1 && i >= trIndex && j >= tdIndex) {
var rowsIndex = i - trIndex;
if (rowsIndex < rows.length) {
var row = rows[rowsIndex];
var rowIndex = j - tdIndex;
if (rowIndex < row.length) {
var val = rows[rowsIndex][rowIndex];
$(td).find("textarea").val(val);
}
}
}
});
})
});
});
方案二:优化方案
粘贴事件发生的时候,获取剪切板的内容,将复制的excel内容分割到二维数组中,然后填充到html的表格的input或textarea中。
var CopyExcel = function (tableId) {
$("#" + tableId).find("input,textarea").on("paste", function (e) {
var pastedText = undefined;
if (window.clipboardData && window.clipboardData.getData) {
// IE
pastedText = window.clipboardData.getData('Text');
} else {
//e.clipboardData.getData('text/plain');
pastedText = e.originalEvent.clipboardData.getData('Text');
}
//阻止粘贴事件的默认行为
e.preventDefault();
var str = pastedText;
var rowStrArray = str.split("\r\n");
var rows = [];
for (var i = 0; i < rowStrArray.length; i++) {
var row = [];
var tdStrArray = rowStrArray[i].split('\t');
for (var j = 0; j < tdStrArray.length; j++) {
row.push(tdStrArray[j]);
}
rows.push(row);
} var startTr = $(this).parents("tr:first");
var startTd = $(this).parents("td:first");
var trIndex = -1;
var tdIndex = -1;
$("tr").each(function (i, tr) {
if (tr == startTr[0]) {
trIndex = i;
} $(tr).find("td").each(function (j, td) {
if (td == startTd[0]) {
tdIndex = j;
} if (trIndex != -1 && tdIndex != -1 && i >= trIndex && j >= tdIndex) {
var rowsIndex = i - trIndex;
if (rowsIndex < rows.length) {
var row = rows[rowsIndex];
var rowIndex = j - tdIndex;
if (rowIndex < row.length) {
var val = rows[rowsIndex][rowIndex];
$(td).find("input,textarea").val(val);
}
}
}
});
})
});
}
excel数据复制到html表格<textarea>中的更多相关文章
- SQL把表中的数据复制到另一个数据库中
1 删除整张表的数据,并还原自增长值TRUNCATE TABLE TbWeixinActivity 2 3张表左连接select a.ID,c.Name,b.nickname,a.CreateDate ...
- SQL数据库中把一个表中的数据复制到另一个表中
1.如果是整个表复制表达如下: insert into table1 select * from table2 2.如果是有选择性的复制数据表达如下: insert into table1(colu ...
- 如何把EXCEL数据导入到SQL SERVER数据库中 (转)
转:http://blog.csdn.net/jjp837661103/article/details/13509889 在我们完成一个项目开发之后,通常我们需要把客户的很多数据导入到数据库中,面对大 ...
- SqlServer表EXCEL数据复制的另一种方法
一个.SqlServer表中的数据复制到excel 1.新建查询,用sql语句把表数据读出来 2.然后,选择数据,右键.复制(也能够点击连同标题复制),拷贝到记事本中(不然会乱码) 3.然后再把记事本 ...
- SQL SERVER 将一个数据库中的表和数据复制到另一个数据库中
第一种情况:将A数据库.dbo.A表的数据追加到B数据库.dbo.B表中 (条件:此时B数据库中已创建好了B表) insert into B数据库.dbo.B表 select * from A数据库. ...
- SQL将一个数据库中的数据复制到另一个数据库中
复制表结构 首先,打开并连接Sql Server,在源数据库Source_db(源数据库名称)上右键,然后依次点击"编写表脚本为"→"CREATE到"→&quo ...
- SQL中如何将一个表中的某一列的数据复制到另一个表中的某一列里
表一: SPRD PRD_NO SPC 001 NULL 002 NULL 003 NULL ... ...
- mysql 将一个表中的数据复制到另一个表中,sql语句
1.表结构相同的表,且在同一数据库(如,table1,table2) Sql :insert into table1 select * from table2 (完全复制) insert into t ...
- Sql Server两个数据库中有一张表的结构一样,怎么快速将一张表中的数据复制到另一个表中
1,下面这句会把表2数据删除,然后把表1复制到表一,两表内容一样 SELECT * into 表2 FROM 表1 2,这句只追加,不删除表2的数据 insert into 表1 select * f ...
随机推荐
- vue项目动态控制数据变动时箭头样式
html代码 <div class="top_precent"> <span :class="{arrow:numPrecent<0}" ...
- 在JSP页面中导入jstl标签库
1 在工程中引用JSTL的两个jar包和标签库描述文件. (1)在项目上右击,从弹出的快捷键菜单中选择Properties命令,在出现的项目属性对话框上,选择DeploymentAssembly. ( ...
- Java 指针or引用?
由一个问题引出:Java到底是传引用还是传值? 如果是传引用,那么为何badSwap函数并没有如预想的那样交换变量? public void badSwap(int var1, int var2) { ...
- CSS3性能体验
如今许多新技术名词在不断的被提及中,已然向我们靠近.某篮球运动员说了:“变向过人”不是超级明星的专利,也许我也可以试着去做,现在看起来效果还不错...那么,现在我们来体验CSS3:CSS3中的动画功能 ...
- [重点]delphi删除部分字符串(不区分大小写)
type TDelFlags = set of (dfDelBefore, dfDelAfter); //删除ms字符串中endstr子字符串前面或后面的部分字符串 procedure Delstr( ...
- Hibernate学习笔记2.1(Hibernate基础配置)
Hibernate基础配置 1.<property name="hbm2ddl.auto">update</property> 在SessionFactor ...
- 升级tensorflow1.0到1.3,报错ImportError: libcudnn.so.6: cannot open shared object file: No such file or directory Failed to load the native TensorFlow runtime.
先定位问题,发现在 /usr/local/cuda/include/ /usr/local/cuda/lib64/ 下面只有 libcudnn.so.5 因此,只要下载cudnn6.*版本的文件分别覆 ...
- hive 踩坑
1. create tabl metastore.MetaStoreDirectSql: Self-test query [select "DB_ID" from "DB ...
- java工程师基础笔试题(一)
一.选择和填空 (不定项哦!) 1,如下是一份文件名为Test2.java的源文件,请问,编译该文件之后会生成几份字节码文件 class Test{ class Inner{} static cla ...
- SpringBoot @Async注解失效分析
有时候在使用的过程中@Async注解会失效(原因和@Transactional注解有时候会失效的原因一样). 下面定义一个Service: 两个异步执行的方法test03()和test02()用来模拟 ...