1

我有一个使用可拖动和可放置的项目列表。它包含您可以移动到可放置文件夹中的项目。您还可以更改以不同顺序拖放项目的顺序。但是精度不好。因此,当前的公差选项都不是我想要的。

正如标题所说;我希望 drop 能够用于最接近可拖动的中间的 droppable 的中间。这也意味着每次下降只能有一个下降区域。我怎样才能使它成为可能?

这是代码的可删除部分:

// Handle
            base.$el.find(base.options.handle).droppable(
            {
                  tolerance  : "intersect"
                , hoverClass : "tree_hover"
                , drop       : function(event, ui)
                {
                    //console.log(pos.target(), pos.section());
                    base.pos.targetX = ui.offset.left;
                    base.pos.targetY = $(this).offset().top;
                    base.pos.targetH = $(this).height();

                    $(this).removeClass('tree_hover');

                    var dropped = ui.draggable;
                    dropped.css({ top: 0, left: 0 });

                    var me = $(this).parent();

                        if (me == dropped)
                            return;

                    ui.draggable.addClass('moved');

                    var subbranch = me.children("ul");

                    switch (base.pos.target())
                    {
                        case 'on':

                            //add as a child
                            if (subbranch.size() == 0)
                            {
                                //add new ul
                                var newb = $('<ul></ul>');
                                newb.append(dropped);
                                me.append(newb);
                            } else {
                                subbranch.eq(0).append(dropped);
                            }

                            if (!me.hasClass('parent')) me.addClass('parent expanded');

                            break;

                        case 'above':

                            //add before
                            dropped.insertBefore(me);
                            break;

                        case 'below':

                            //add after
                            dropped.insertAfter(me);
                            break;  
                    }

                    me.removeClass('on above below');

                    //remove parent from items that no longer contain children
                    $('ul.tree li.parent ul').filter(function()
                    {
                        return $(this).children().length == 0;

                    }).closest('li').removeClass('parent').end().remove();

                    //callback
                    if (base.options.itemMoved != null)
                    {
                        base.options.itemMoved(base.getMoved());
                    }

                }, over: function(e, ui)
                {
                    base.pos.targetX = ui.offset.left;
                    base.pos.targetY = $(this).offset().top;
                    base.pos.targetH = $(this).height();

                }, out: function(e, ui)
                {
                    $(this).closest('li').removeClass('on above below');
                }
            });
4

0 回答 0