方案一
多行文本框接收到复制的excel值后,在文本框的chage事件中,将excel内容分割到二维数组中,然后填充到html的表格的input或textarea中。
数据格式: 单元格复制后的数据格式为"设备 缺陷类型 水压堵阀 母材裂纹"。
注释:单元格之间通过" "分隔,行间通过" "分隔。数据必须粘贴到<textarea>多文本框中,如果是<input>控件换行符" "会被删除掉。表格中要使用<textarea>接收数据,
$(function () { $("textarea").on("change", function () { var str = $(this).val(); var rowStrArray = str.split(" "); var rows = []; for (var i = 0; i < rowStrArray.length; i++) { var row = []; var tdStrArray = rowStrArray[i].split(' '); 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(" "); var rows = []; for (var i = 0; i < rowStrArray.length; i++) { var row = []; var tdStrArray = rowStrArray[i].split(' '); 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); } } } }); }) }); }