使用jquery将特定列值从一个html表传递到另一个html表

我希望将一个特定列的列值复制到另一个表列

场景：

表1：一个包含n列和excel数据的html表

我正在努力实现：

Table2：将特定列值从table1传递到Table2的一列，在与table1相同的js文件中

表1——代码：

$（函数（）{
$（“#上载”）.bind（“单击”），函数（）{
var regex=/^（[a-zA-Z0-9\s\\\.\-：]）+（.csv|.txt|.xlsx|.xls）$/；
if（regex.test（$（“#fileUpload”）.val（）.toLowerCase（））{
if（typeof（FileReader）！=“未定义”）{
var reader=new FileReader（）；
reader.onload=函数（e）{
变量表=$（“”）；
var rows=e.target.result.split（“\n”）；
对于（变量i=0；i

---

这里我为每个单元格创建一个css类。是否可以将一个特定列复制到另一个表的列中？

为了完整性，我决定包含两个解决方案：

将整列数据从一个表复制到另一个表（注意）我还为您添加了一种基于第一个表的维度自动生成第二个表的方法

将一行数据从一个表复制到另一个表

---

将整列复制到另一个表 如果要复制一列数据，则需要在单元格数据、其对应的列和行之间进行一点映射，下面的示例应该可以使用（脚本中的注释）：

GenerateTable2（）；
//根据表1中的列/行总数自动生成表2
函数GenerateTable2（）{
var totalRowsToGenerate=$（“#表1 tr”）.sibbins（）和self（）.length；
var totalColumnsToGenerate=$（“#表1 td”）.sides（）.andSelf（）.length/totalRowsToGenerate；
$（“#table2Container”）。追加（“”）；
对于（行=0；行

表格{
字体系列：“投石机MS”，Arial，Helvetica，无衬线；
边界塌陷：塌陷；
宽度：100%；
}
表td{
边框：1px实心#ddd；
填充：8px；
}
表tr：第n个子项（偶数）{
背景色：#F2F2；
}
表tr：悬停{
背景色：#ddd；
}
#表1{
光标：复制；
}
#表2{
光标：不允许；
}

表1

1.
2.
3.
4.
5.
6.
7.
8.
9
10
11
12
表2

纯代码编写请求与堆栈溢出无关——我们希望这里的问题与特定的编程问题有关——但我们很乐意帮助您自己编写！告诉我们，你被困在哪里了。这也有助于我们更好地回答您的问题。请分享您尝试执行此操作的代码以及您遇到的错误（如果有）？澄清一下，当您说“列值”时，您的意思是：1。单个

（单元格）

的内容？2.每个

的内容垂直堆叠（列）。

<script type="text/javascript">

    $(function () {
        $("#upload").bind("click", function () {
            var regex = /^([a-zA-Z0-9\s_\\.\-:])+(.csv|.txt|.xlsx|.xls)$/;
            if (regex.test($("#fileUpload").val().toLowerCase())) {
                if (typeof (FileReader) != "undefined") {
                    var reader = new FileReader();
                    reader.onload = function (e) {
                        var table = $("<table />");
                        var rows = e.target.result.split("\n");
                        for (var i = 0; i < rows.length; i++) {
                            var row = $("<tr />");
                            var cells = rows[i].split(",");
                            for (var j = 0; j < cells.length; j++) {
                                var cell = $("<td />");
                                cell.html(cells[j]);
                                cell.addClass("myclass" + j);
                                row.append(cell);
                            }
                            table.append(row);
                            //table.append("<td><input type='text' name='object'></td><td><input type='text' name='attr'></td>");
                        }
                        $("#dvCSV").html('The Customer Mappings are:');
                        $("#dvCSV").append(table);
                        $('#dvCSV table').addClass("dvCSV1");
                        //  $('#dvCSV table').find('td:eq(10),th:eq(10)').remove();
                        //  $('#dvCSV table').find("td").last().remove();
                        $('#dvCSV table').find('td.myclass10,th.myclass10,td.myclass9,th.myclass9').remove();
                        //  $("#dvCSV").append("<td><input type='text' name='object'></td><td><input type='text' name='attr'></td>");
                        // $('#dvCSV table').append('<td><input type="checkbox" name="cb"/></td>');
                    }
                    reader.readAsText($("#fileUpload")[0].files[0]);
                } else {
                    alert("This browser does not support HTML5.");
                }
            } else {
                alert("Please upload a valid CSV file.");
            }
        });
    });
</script>

//When user clicks on cell
$("#table1 tr td").on("click", function() {
  var cells = [];
  var cellIndex = $(this).index();

  //loop through all rows gathering column data
  $(this).parent().siblings().andSelf().each(function() {
    var colValue = $(this).find("td").eq(cellIndex).text();
    var colKey = cellIndex;
    var rowKey = $(this).index();

    //Create JSON column object
    var column = {};
    column.Key = colKey;
    column.Value = colValue;
    column.RowKey = rowKey;

    //push onto array
    cells.push(column);
  });

  //call the copy function
  copyColumn(cells);
});

function copyColumn(cells) {
  //loop through JSON object
  $.each(cells, function(key, value) {
    //Map the data with the corresponding cell in second table
    $("#table2 tr td").each(function() {
      if ($(this).index() == value.Key && $(this).parent().index() == value.RowKey) {
        //set text value of cell
        $(this).text(value.Value);
      }
    });
  });
}