4

我有一些类似于下面的标记，我试图隐藏“some_row”TR。

<div id="sortable">
<table>
    <tr><td>Some Title 1</td></tr>
    <tr class="some_row"><td><textarea ...></td><tr>
</table>    
<table>
    <tr><td>Some Title 2</td></tr>
    <tr class="some_row"><td><textarea ...></td><tr>
</table>
</div>

这是我尝试过的：

$(function () {
    $("#sortable")
    .sortable({
        helper: function (e, o) {
            o.find("#some_row").hide();
            return o;
        },
        start: function () {
            $(".some_row").hide();
        },
        stop: function () {
            $(".some_row").show();
        }
    })
    .disableSelection();
});

最初我从 juststart和stopevents 开始，然后我添加helper了，因为我猜是一个克隆的选定行，有一个隐藏的 some_row div，但高度相同。

无论如何，就样式而言，上述工作完美，但似乎小部件仍在考虑周围 div 的原始高度。

我能做些什么来挽救这个想法吗？

4

1 回答 1

1

您需要在.somerow返回帮助程序之前调用 hide on。

助手是原始 div 的克隆以及您看到的被拖动的内容。因此，当您隐藏行时，克隆已经创建。

启动后运行的刷新完成以重新加载可排序对象以调整新高度。

小提琴示例

$(function () {
$("#sortable")
.sortable({
    cursor: 'move',
    cursorAt: { left: 0, top: 10 },
    helper: function (e, o) {
        $(".some_row").hide();
        o.find("#some_row").hide();
        return o;
    },
    start: function () {
        $( "#sortable" ).sortable( "refresh" );
    },
    stop: function () {
        $(".some_row").show();
    }
})
.disableSelection();
});

您还可以使用jqueryui sortable apicursor的andcursorAt选项定义拖动时的光标位置（相对于助手）和悬停时显示的光标类型

于 2012-11-19T18:25:24.013 回答