jQuery UI sortable tolerance option not working as expected

前端 未结 6 1602
[愿得一人]
[愿得一人] 2020-12-14 04:13

Here is the part from jQuery UI documentation for the tolerance option:

This is the way the reordering behaves during drag. Possible valu

6条回答
  •  再見小時候
    2020-12-14 04:26

    For those with the same problem here's the workaround I use:

    $('#sortable').sortable({
        axis: 'x',
        sort: function (event, ui) {
            var that = $(this),
                w = ui.helper.outerWidth();
            that.children().each(function () {
                if ($(this).hasClass('ui-sortable-helper') || $(this).hasClass('ui-sortable-placeholder')) 
                    return true;
                // If overlap is more than half of the dragged item
                var dist = Math.abs(ui.position.left - $(this).position().left),
                    before = ui.position.left > $(this).position().left;
                if ((w - dist) > (w / 2) && (dist < w)) {
                    if (before)
                        $('.ui-sortable-placeholder', that).insertBefore($(this));
                    else
                        $('.ui-sortable-placeholder', that).insertAfter($(this));
                    return false;
                }
            });
        },
    });​
    

    This works for a horizontal sortable, for a vertical one change outerWidth to outerHeight and position.left to position.top everywhere.

    Here's a complete working example

提交回复
热议问题