JQuery ui可排序拖动问题

Question

iam 使用 jquery ui 10.1.3，当垂直拖动行时，被拖动行的宽度会有小的变化。当看着论坛看起来像下面的错误代表它。 我的表有不可见的列（隐藏列）。

我们有什么解决办法吗？

http://bugs.jqueryui.com/ticket/9979

https://github.com/jquery/jquery-ui/commit/9711c54c6d3d7ecffa9bfccc205522be1f4aa148

Answer 1

这里的问题是 jQueryUI 正在添加一个占位符行，其类为 ui-sortable-placeholder。占位符设置为visibility:hidden。这意味着您无法看到它，但它会占用正常可见的空间。

在这个 JSBin 中，每一行的第二列都是隐藏的。这意味着第二列不会占用任何空间。这里的问题是，当jQueryUI创建占位符列时，它没有隐藏第二列。

Look at this JSFiddle 你就会明白我的意思了。占位符在第一列和第二列之间添加了一个蓝色列。

您可以通过多种方式摆脱这种情况。一，通过硬编码CSS来隐藏第二列as shown here，在这段代码中：

.ui-sortable-placeholder td:nth-child(2)
{
    display:none;
}

另一种方法是添加一些代码来隐藏占位符中隐藏在真实表中的列as shown here，并在此代码中：

sort: function (e, ui) {
    ui.placeholder.find('td').each(function (key, value) {
        //alternative: if (!ui.item.find('td').hasClass('hidden')) $(this).show();
        if (ui.helper.find('td').eq(key).is(':visible')) $(this).show();
        else $(this).hide();
    });
}