jquery之将两个图像绑定(bind)在一起以进行拖动

我正在寻求有关脚本的帮助，以一次将两个图像拖到一起。我目前有一个脚本，允许我将缩略图拖到收集箱中以便稍后保存。然而，我的一些缩略图的顶部有一个图像，以将这些缩略图图像表示为“未知”植物。我想知道是否有人可以为我指明正确的方向，告诉我如何将这两个图像绑定(bind)在一起以进行拖动。这是我的代码:

$(document).ready(function() { 
var limit = 16; 
var counter = 0; 
$("#mainBin1, #mainBin2, #mainBin3, #mainBin4, #mainBin5, #bin_One_Hd, #bin_Two_Hd, #bin_Three_Hd, #bin_Four_Hd, #bin_Five_Hd").droppable({ 
    accept: ".selector, .plant_Unknown", 
    drop: function(event, ui) { 
                counter++;   
        if (counter == limit) { 
            $(this).droppable("disable"); 
 
        } 
 
 
            $(this).append($(ui.draggable).clone()); 
 
 
            $("#cbOptions").show(); 
            $(".item").draggable({ 
                    containment: "parent", 
                    grid: [72,72], 
            }); 
    } 
}); 
$(".selector").draggable({ 
   helper: "clone", 
    revert: "invalid", 
    revertDuration: 700, 
    opacity: 0.75, 
}); 
 
 $(".plant_Unknown").draggable({ 
   helper: "clone", 
    revert: "invalid", 
    revertDuration: 700, 
    opacity: 0.75, 
}); 

});

任何帮助将不胜感激。谢谢。

编辑:Website

请您参考如下方法:

您可以用一个可拖动的容器包围当前的可拖动元素，而不是以前的容器。

<div class=".container"> 
    <div class=".selector">...</div> 
    <div class=".plant_Unknown">...</div> 
</div> 

然后，将可拖动调用替换为:

$(".container").draggable({ 
   helper: "clone", 
    revert: "invalid", 
    revertDuration: 700, 
    opacity: 0.75, 
}); 

PS:看到网站后，您也可以考虑将链接标记作为建议的容器。