Question

我想有一个表允许我拖放以重新排序其中的行。

我发现这篇帖子非常有帮助：

Reorder HTML table rows using drag-and-drop

这篇文章给出了一个解决方案，它的jsfiddle示例在这里：http://jsfiddle.net/pmw57/tzYbU/205/

这是它的Javascript：

var fixHelperModified = function(e, tr) {
    var $originals = tr.children();
    var $helper = tr.clone();
    $helper.children().each(function(index) {
        $(this).width($originals.eq(index).width())
    });
    return $helper;
},
    updateIndex = function(e, ui) {
        $('td.index', ui.item.parent()).each(function (i) {
            $(this).html(i + 1);
        });
    };

$("#sort tbody").sortable({
    helper: fixHelperModified,
    stop: updateIndex
}).disableSelection();

然而，在我看来，解决方案并没有完全发挥作用。如果你拖着上帝保佑你，罗斯沃特先生＆＃34;一行，你知道我在说什么。

这可以修复吗？

感谢。

Answer 1

这是因为宽度是动态更新的。如果您找到最宽的<td>标题元素，然后将所有<td>标题元素设置为该宽度，那么您将不会遇到表格重新调整大小的问题。

var maxWidth = 0;
$('#sort td:nth-child(3)').each(function(){
    if(maxWidth < $(this).width())
        maxWidth = $(this).width();
});

$('#sort td:nth-child(3)').css('width',maxWidth);

示例：

http://jsfiddle.net/trevordowdle/2Sg8v/

拖放时，表及其行的宽度会发生变化，以便对其行重新排序

1 个答案: