Question

我要做的是将表中的最后一个colomn放入一张新表中。我得到了这个工作问题是我希望这适用于具有相同类名的多个表。现在它只需要第一个表cols并重复它们。我知道为什么，但我不确定如何将每个表作为单个元素进行定位，即使它们都具有相同的类名。

jquery

function fixLastColumn() {                
// makes new table 
     var nt = $('<table class="ft_fixedTable"></table>');

     $(".ft_FixedTable tr").each(function(i) { 
        nt.append('<tr class="ft_fixTR"><td class="ft_fixTD">'+$(this).children('td:last').html()+'</td></tr>')
     })
    nt.appendTo('.fixedDiv');

    // remove last column
    $('.ft_FixedTable tr').each(function(i) {
   $(this).children('td:last').remove();
     });
   }

$(document).ready(function() {
    fixLastColumn();
 });

HTML

<table class="ft_FixedTable">
    <thead> 
        <tr>
        <td>Title 1</td>
        <td class="ft_fixedCol">fixed one</td></tr>
    </thead>
    <tr>
    <td>Content Content Content Content Content</td>
    <td>Fixed content </td>
    </tr>
</table>

<div class="fixedDiv"></div>

Answer 1

您可以使用JavaScript移动表格单元格而不是仅复制内容：

function fixLastColumn() {
    // makes new table 
    var nt = $('<table id="ft_fixedTable_2" />');

    $(".ft_FixedTable tr").each(function(i) {
        $('<tr class="ft_fixTR"/>')
            .append($(this).children('td:last'))
            .appendTo(nt);
    })
    nt.appendTo('.fixedDiv');
}

$(document).ready(function() {
    fixLastColumn();
});

然而，作为（小但可能很重要）优化，您应该使用ID而不是类来标识表和div：

http://jsfiddle.net/mblase75/TVpHp/

Answer 2

这可能与您选择ft_FixedTable这一事实有关，但您分配新表的课程为ft_fixedTable。请注意较低的f。

这是你想要的吗？ http://jsfiddle.net/hunter/NzbHs/

Answer 3

$(".ft_FixedTable").each(function() {
  var $last = $("td:last", this).remove();

  $('<table class="ft_fixedTable"></table>')
  .append('<tr class="ft_fixTR"><td class="ft_fixTD">' 
          + $last.html() 
          + '</td></tr>'
  )
  .appendTo('.fixedDiv');
});

Answer 4

如果我正确理解您的问题，.each()方法仅适用于选择器的第一项，在本例中是第一个带有ft_FixedTable类的表。您可以尝试这样做：

$(document).ready(function () {
    $('.ft_FixedTable').each(function () {
        var index = $('tr td:last', this).index();
        $('tr td', this).eq(index).remove();
    });
});

这将找到最后一列索引，并从当前表中的所有行中删除td。

使用jquery将一个表列移动到一个新表

4 个答案: