jQuery的多拖动

Question

编辑＃1：

因为我问这个问题，我做了一个脚本，它允许元素一起移动，但有问题的。 :(

$(this).append(

    $('<div class="elem '+classes+'" style="width: 210px; height: 30px" data-modby="'+ui.draggable.attr("data-for")+'"><p>'+text+'</p></div>') 
    .resizable({ 
     grid: 10, 
     maxHeight: 120, 
     maxWidth: 600, 
     minHeight: 30, 
     minWidth: 210, 
     containment: ".box-section" 
    }) 
    .draggable({ 
     grid: [10,10], 
     containment: ".box-section", 
     scroll: false, 
     helper: "original", 
     start: function(event, ui) { 
      posTopArray = []; 
      posLeftArray = []; 
       if ($(this).hasClass("r-active")) { 
        $(".elem.r-active").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("r-active")) { 
       $(".elem.r-active").each(function(i) { 
        $(this).css('top', posTopArray[i] + topdiff); 
        $(this).css('left', posLeftArray[i] + leftdiff); 
       }); 
      } 
     } 
    }) 
); 

的实际问题，为移动的元素必须留在收纳箱（称为.box-section，如果我有一个单一的元素，它工作正常。另外，如果我有两个元素具有不一样的宽度，如果另外，如果我将它们快速移动（就像忍者一样），它们就会滑落，并且它们将不在同一个网格中是。所以

---

30％因为：

我要做一个新的东西，它可以拖放项目到一个盒子，并调整它们。

我的问题是，我不能让他们一起移动。但有一些规则。

规则一：它们必须基于10x10px网格移动。规则二：他们不能移出他们的框架。 （调整大小是我根本无法想象的问题，所以我不在意它，调整大小将在以后）

我在这里为它做了一个小提琴：http://jsfiddle.net/9fueY/你可以看到这个。

在右侧，您可以看到输入和a和复选框（并将鼠标悬停在按钮上）。
该复选框是可拖动的对象，将其拖动到图像上。现在你在左边出现了一些文字或一颗星星。 如果您输入任何内容，它会刷新文本。

在右侧的框中可以看到一个按钮。通过点击它，将会克隆第一个元素。将其拖入里面。

如果您单击右侧框，它会发出蓝光。点击右侧的两个框，使图像中的所有两个文本框都变成蓝色。

现在，当我希望他们一起移动时就是这种情况。 ：D

您的意见是什么？我该怎么做？

非常感谢。 - Répás

Answer 1

我开发了一个插件，用于将元素拖放到一起。请确实使用它。

https://github.com/someshwara/MultiDraggable