html页面获取粘贴到表格,JS实现将Excel中的数据粘贴到HTML表格中

以前都不敢想，一直以为将Excel中的数据粘贴到HTML表格当中是一件很高大上的事情，实际研究发现其实也不难。

以下是我今天研究出来的一个例子，希望可以给需要的人提供帮助。

支持：IE8、Chrome，别的浏览器没有试过，我的电脑就这两个浏览器。

Ctrl + V

$(document).ready(function(){

$(document.body).bind({

paste: function(e) {

if (window.clipboardData) {

return ;

}

var clipboardData = e.originalEvent.clipboardData;

processData(clipboardData);

}

});

document.onkeyup = function(e) {

if (window.clipboardData) {

e = window.event || e;

var keyCode = e.keyCode || e.which || e.charCode;

var ctrlKey = e.ctrlKey || e.metaKey;

if (ctrlKey && keyCode == 86) {

var clipboardData = window.clipboardData;

processData(clipboardData);

}

}

return false;

}

var processData = function(clipboardData) {

$('table#dgBudget>tbody>tr.datarow').remove();

var data = clipboardData.getData('Text').split('\n');

var dataHtml = '';

for (var i = 0; i < data.length; i++) {

if (!data[i]) {

continue ;

}

var bugdetData = data[i].split('\t');

dataHtml += '

';

dataHtml += '

' + (bugdetData[0] || ' ') + '';

dataHtml += '

' + (bugdetData[1] || ' ') + '';

dataHtml += '

' + (bugdetData[2] || ' ') + '';

dataHtml += '

' + (bugdetData[3] || ' ') + '';

dataHtml += '

' + (bugdetData[4] || ' ') + '';

dataHtml += '

' + (bugdetData[5] || ' ') + '';

dataHtml += '

' + (bugdetData[6] || ' ') + '';

dataHtml += '

' + (bugdetData[7] || ' ') + '';

dataHtml += '

' + (bugdetData[8] || ' ') + '';

dataHtml += '

' + (bugdetData[9] || ' ') + '';

dataHtml += '

' + (bugdetData[10] || ' ') + '';

dataHtml += '

' + (bugdetData[11] || ' ') + '';

dataHtml += '

' + (bugdetData[12] || ' ') + '';

dataHtml += '

';

}

$('table#dgBudget>tbody>tr').after(dataHtml);

};

});

使用 Ctrl + V 可粘贴预算数据到下表中

科目名称	1月	2月	3月	4月	5月	6月	7月	8月	9月	10月	11月	12月

运行效果图：

1、复制Excel的数据。

2、打开HTML页面，使用“Ctrl + V”粘贴至表格当中。