Question

我正在使用jQuery UI来允许类的元素。但是，当其中一个元素被拖动时，我希望类的其余元素可以遵循。我怎么能这样做？

所以当一个人被拖动时，其余的人也被拖了。

我尝试在元素上的停止事件的启动和鼠标上触发mousedown，以便在拖动其中一个元素时对其他人进行拖动？

$('.dismissAllButton').draggable({ axis:'x', containment:'parent', start:function(){ upEvent = false; $(this).mousedown(); }, drag: function(){ $(this).mousemove(); }, stop:function(){ $(this).mouseup(); setTimeout(function(){ upEvent = true; }, 1000); }});

我也尝试让自己成为父母，以便当其中一个被拖动时，其他人也会被拖动/跟随，但这不起作用。

$('.dismissAllButton').draggable({ axis:'x', containment:'parent', handle:'.dismissAllButton', start:function(){ upEvent = false; }, stop:function(){ setTimeout(function(){ upEvent = true; }, 1000); }});

小提琴：

没有以下，只需拖动一个元素：http://jsfiddle.net/7ta68xyt/

尝试1，上面的代码示例1，：http://jsfiddle.net/7ta68xyt/1/

尝试2，上面的代码示例2，：http://jsfiddle.net/7ta68xyt/2/

更新：我在github上发现了一个允许这样做的脚本，但其他元素都落后了一点。如何让它们在一定时间间隔内延迟，并在拖动停止时将它们拖到相同的位置或将它们全部拖动相同（无滞后）。

这是小提琴：http://jsfiddle.net/7ta68xyt/3/

以下是脚本：https://github.com/javadoug/jquery.drag-multiple

Answer 1

在这里，您可以选择使用jQuery ui http://jsfiddle.net/7ta68xyt/5/

$(".dismissAllButton").draggable({
    axis: 'x',
    containment: 'parent',
    start: function (event, ui) {
        posTopArray = [];
        posLeftArray = [];
        if ($(this).hasClass("group")) {
            $(".group").each(function (i) {
                thiscsstop = $(this).css('top');
                if (thiscsstop == 'auto') thiscsstop = 0;     
                thiscssleft = $(this).css('left');
                if (thiscssleft == 'auto') thiscssleft = 0;     
                posTopArray[i] = parseInt(thiscsstop);
                posLeftArray[i] = parseInt(thiscssleft);
            });
        }

        begintop = $(this).offset().top;
        beginleft = $(this).offset().left;
    },
    drag: function (event, ui) {
        var topdiff = $(this).offset().top - begintop;
        var leftdiff = $(this).offset().left - beginleft;

        if ($(this).hasClass("group")) {
            $(".group").each(function (i) {
                $(this).css('top', posTopArray[i] + topdiff);
                $(this).css('left', posLeftArray[i] + leftdiff);
            });
        }
    }
});

在拖动一个类时拖动类的所有元素（jQuery UI可拖动）

1 个答案: