jQuery UI可排序:容差“相交”不能按预期工作(bug#8342)

时间:2013-03-27 16:27:42

标签: jquery-ui jquery-ui-sortable

9天前(撰写本文时),以下错误已重新开启: Sortable: Incorrect behaviour (or incorrect documentation) of sortable option tolerance: 'intersect'

不幸的是我不能等待jQuery解决这个问题。

我有一个容器,其中的项目可以垂直排序(所有<div> s)。这些项目具有不同的高度(并且没有预定义的高度)。

是否有可行的解决方法?

1 个答案:

答案 0 :(得分:1)

我自己写了一个解决方法,受到dioslaska解决他自己问题的启发: jQuery UI sortable tolerance option not working as expected

它运作得非常顺利:)

删除tolerance选项,并将以下函数用作sort选项:

function( e, ui ) {
    var container   = $( this ),
        placeholder = container.children( '.ui-sortable-placeholder:first' );

    var helpHeight  = ui.helper.outerHeight(),
        helpTop     = ui.position.top,
        helpBottom  = helpTop + helpHeight;

    container.children().each( function () {
        var item = $( this );

        if( !item.hasClass( 'ui-sortable-helper' ) && !item.hasClass( 'ui-sortable-placeholder' )) {
            var itemHeight = item.outerHeight(),
                itemTop    = item.position().top,
                itemBottom = itemTop + itemHeight;

            if(( helpTop > itemTop ) && ( helpTop < itemBottom )) {
                var tolerance = Math.min( helpHeight, itemHeight ) / 2,
                    distance  = helpTop - itemTop;

                if( distance < tolerance ) {
                    placeholder.insertBefore( item );
                    container.sortable( 'refreshPositions' );
                    return false;
                }

            } else if(( helpBottom < itemBottom ) && ( helpBottom > itemTop )) {
                var tolerance = Math.min( helpHeight, itemHeight ) / 2,
                    distance  = itemBottom - helpBottom;

                if( distance < tolerance ) {
                    placeholder.insertAfter( item );
                    container.sortable( 'refreshPositions' );
                    return false;
                }
            }
        }
    });
}