使用 Javascript,我如何创建一个 HTML 表格,该表格可以通过电子表格中的“复制”,然后“粘贴”到浏览器中的表格中,“接受”来自 excel(或 google 电子表格)的数字矩阵数据。
4 回答
这只能在 IE 上可靠地工作,因为 Firefox(可能还有其他)不允许在没有特别允许的情况下访问剪贴板;较早的建议先粘贴到 textarea 可能比这更好。
当您从电子表格复制时,通常用制表符 (chr9) 分隔单元格,用 CR (chr13) 分隔行。此脚本将剪贴板转换为 2D 数组,然后从中构建表格。不太优雅,但它似乎可以从 Excel 中复制数据。
<html>
<head>
<script language="javascript">
function clip() {
// get the clipboard text
var clipText = window.clipboardData.getData('Text');
// split into rows
clipRows = clipText.split(String.fromCharCode(13));
// split rows into columns
for (i=0; i<clipRows.length; i++) {
clipRows[i] = clipRows[i].split(String.fromCharCode(9));
}
// write out in a table
newTable = document.createElement("table")
newTable.border = 1;
for (i=0; i<clipRows.length - 1; i++) {
newRow = newTable.insertRow();
for (j=0; j<clipRows[i].length; j++) {
newCell = newRow.insertCell();
if (clipRows[i][j].length == 0) {
newCell.innerText = ' ';
}
else {
newCell.innerText = clipRows[i][j];
}
}
}
document.body.appendChild(newTable);
}
</script>
</head>
<body>
<input type="button" onclick="clip()">
</body>
</html>
这是我创建的 javascript 代码(基于有用的答案)。我是 javascript 新手,所以我确信有更好的方法可以做到这一点,但它似乎有效......目标是将两列数字数据从电子表格“粘贴”到文本区域(我已经尝试过 excel 和 google 电子表格)并创建浮点向量“xf”和“yf”。希望对某人有用。欢迎批评...
它假设这些存在于 html 页面上......
<textarea id="psmtext" rows=24 cols=72> </textarea>
<input type="button" value="run code" onClick="psmtest();">
function psmtest(){
var psmtext = document.getElementById("psmtext");
var st = psmtext.value;
Ast = st.split("\n");
var numrows = Ast.length;
var ii;
var xs = [];
var ys = [];
for (ii = 0 ; ii < numrows ; ii++) {
// tab or comma deliminated data
if ( Ast[ii].split(",",2)[1] != null ){ ys[ii] = Ast[ii].split(",")[1]; xs[ii] = Ast[ii].split(",")[0];}
if ( Ast[ii].split("\t",2)[1] != null ){ ys[ii] = Ast[ii].split("\t")[1]; xs[ii] = Ast[ii].split("\t")[0];}
}
var xss = [];
var yss = [];
var numgoodrows = 0;
var iii =0;
for (ii = 0 ; ii < numrows ; ii++) {
if ( xs[ii] != null && ys[ii] != null) {
xss[iii] = xs[ii];
yss[iii] = ys[ii];
iii++;
}
}
numgoodrows = iii;
// next I need to convert to floating point array var xf = [], var yf = [];
var xf = [];
var yf = [];
for (ii = 0 ; ii < numgoodrows ; ii++) {
xf[ii] = parseFloat(xss[ii]);
yf[ii] = parseFloat(yss[ii]);
}
}
这将很难真正做好。
在我的脑海中,我想说最好的方法是给用户一个<textarea>
他们可以粘贴的东西。然后,在 onchange 事件处理程序中,使用一些 JS 解析来确定行和列的排列位置,创建 HTML 表并将其注入 DOM。
对于相对“方形”的数据集,这应该可以正常工作 - 您可能会遇到合并列/行和“锯齿状”数据的更多问题
虽然这个问题被认为已经回答(并且是一个老问题),但我想指出现在有更好的解决方案,请参阅jQuery Spreadsheet/Grid plugin with copy/paste from/to Excel。我特别喜欢warpech(也是这个 jQuery 插件的创建者)建议的HandsOnTable的极简主义。该插件仍然维护得很好。