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 ...
随机推荐
- 16.监听器-基础.md
目录 概念 监听器功能 监听创建或销毁 监听属性变化 session相关监听 概念 实现特定接口的普通java类 *监听特定对象的创建.销毁或属性变化: 对象自己创建自己用:无需监听 对象别人创建自己 ...
- spring使用中ModelAttribute的内容被覆盖
在前台以get方式向后台提交数据: 后台接收: 后台接收参数的时候,由于user里面也有一个属性为id,后台在接收参数的时候,User里面的id会被重新赋值,这是一个大坑.如果后续继续用User来做操 ...
- proxool连接sqlerver
原先proxool连接sqlserver,用的是sqljdbc,不知道怎么回事,怎么也连接不上.下面的代码既不报错也不执行下去,应该是驱动出了问题,网上也很难找到sqljdbc什么版本. if (_c ...
- idea git 把本地项目上传到github上
创建一个项目,在项目文件夹下执行以下命令 第二种方法: 先在idea上创建一个项目 注意以上只是在本地建立了本地仓库,代码都放在本地仓库. 现在上传到github上 到此才上传成功
- 吴裕雄 oracle 存储过程
- 基础的正则表达式与re模块(2)
一.元字符 字符组是元字符中的一个.在字符组中所有的字符都可以匹配任意一个字符位置上能出现的内容,如果在字符串中有任意一个字符是字符组中的内容,那么就是匹配上的项. [0-9] [a-z] ...
- yii Nav:widget 配置参数encodeLabels
echo Nav::widget([ 'options' => ['class' => 'navbar-nav navbar-right'], 'encodeLabels' => f ...
- JAVA语言 第三周
第三周,跟随菜鸟教程学习了一些简单的JAVA语法,包括数据类型.变量.修饰符.运算符.循环.数组.继承. 这些在结构中与c++相似,但语法有些不同.在这些方面,我做了一些总结. 开学测试那张卷子,被我 ...
- 2018面向对象程序设计(Java) 第2周学习指导及要求
2018面向对象程序设计(Java) 第2周学习指导及要求(2018.9.3-2018.9.9) 学习目标 适应老师教学方式,能按照自主学习要求完成本周理论知识学习: 掌握Java Applica ...
- Bootstrap Popover
[Bootstrap Popover] 1.设置一个popover需要添加以下设置: 1)data-toggle="popover" 2)title="Example p ...