Question

我有一个固定标题的表格，前3列是固定的。

http://jsfiddle.net/ncUdA/embedded/result/

我想拖放列（即）A，B，C，D，E，F是应该可移动（拖放）的列。它下面的所有元素也应该转移到新的位置。

我发现了一个插件可以实现我想要的但我无法实现，因为在我的代码中使用了多个表来修复标题和固定的3列。

http://johnny.github.com/jquery-sortable/#table

下面的代码是关于如何操作的插件代码。

我正在使用把手进行模板化。

    var oldIndex
    $('.sorted_head tr').sortable({
      containerSelector: 'tr',
      itemSelector: 'th',
      placeholder: '<th class="placeholder"/>',
      vertical: false,
      onDragStart: function (item, group, _super) {
        oldIndex = item.index()
        item.appendTo(item.parent())
        _super(item)
      },
      onDrop: function  (item, container, _super) {
        var field,
        newIndex = item.index()

        if(newIndex != oldIndex)
          item.closest('table').find('tbody tr').each(function (i, row) {
            row = $(row)
            field = row.children().eq(oldIndex)
            if(newIndex)
              field.before(row.children()[newIndex])
            else
              row.prepend(field)
          })

        _super(item)
      }
    })

Answer 1

google-ing后，使用drag＆＃39; n＆＃39; drop查找重新排序表格列的解决方案。我发现＆＃39; akottr＆＃39;写了一个很棒的jquery插件。 here

它是一个独立于库的js函数，使您能够使用拖动来重新排序表列。它非常易于使用。

$('#defaultTable').dragtable();

因此，我希望你能得到你想要的重新订购表。请查看更多示例：http://akottr.github.io/dragtable/

使用jquery插件拖放表列

1 个答案: