web-dev-qa-db-ja.com

ExcelデータをHTMLテーブルに貼り付け

JavaScriptを使用して、スプレッドシートで「コピー」し、ブラウザのテーブルに「貼り付け」て、Excel（またはgoogleスプレッドシート）から数値マトリックスデータを「受け入れる」ことができるHTMLテーブルを作成する方法を教えてください。

javascripthtml-tablespreadsheet
25
perrinmeyer

これは確実にIEでのみ確実に機能します。Firefox（および他の可能性が高いため）は、特にそれを許可せずにクリップボードへのアクセスを許可していません。 。

スプレッドシートからコピーする場合、通常、セルはタブ（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>
19
Paul Abbott

これが私が作成したjavascriptコードです（役立つ回答に基づいて）。私はJavaScriptが初めてなので、これを行うにはもっと良い方法があると確信していますが、うまくいくようです...目標は、スプレッドシートからテキスト領域に2列の数値データを「貼り付ける」ことです（私は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]);
  }


}
5
perrinmeyer

これは本当にうまくやるのが非常に難しいでしょう。

私の頭の外では、ユーザーに<textarea>貼り付けることができます。次に、onchangeイベントハンドラーで、JS解析を使用して行と列がどこに並んでいるかを調べ、HTMLテーブルを作成してDOMに挿入します。

これは比較的「正方形」のデータセットで問題なく機能するはずです-マージされた列/行と「ギザギザ」のデータでさらに問題が発生する可能性があります

1
nikmd23

この質問はすでに回答されていると見なされています（古くなっています）が、今日はより良い解決策があることを指摘しておきます。 jQuery Spreadsheet/Grid plugin with copy/paste from/to Excel を参照してください。私は特に、 the HandsOnTable のミニマリズムが好きです。 はwarpech （このjQueryプラグインの作成者でもある）によって提案されました。プラグインはまだ非常によく維持されています。

0
murb