仅获得分配给 this.class 的最后一个类

Question

请任何人看看这段代码有什么问题， 我有 2 个带有 .man 和 .girl 的类图像，每个图像包含 10 个图像。 接下来我有 2 个 div 的 #manCount 和 #girlCount 显示总图像数（每个 10）

当我将一张图片移动到#drop 时，它会从#manCount 减少 1 个数字。所以总共有 10 个类名为 .man 的图像，当最后一个图像移动到 #drop 时，我会弹出一个窗口，显示所有图像都已处理。

现在我也想处理 .girl 类图像，但是当我让两个类都初始化时，它只能与 .girl 类一起使用。

function Dragger(c){
this.classname = c;

}
Dragger.prototype.Init = function(){
    var classM = this.classname;
    var manCount = parseInt($("#"+classM+"Count").text());
    $("."+classM).draggable();
        $("#drop").droppable({
          drop: function() {
           if(manCount <= 0){
               alert("There are no more pictures left. " + classM );
               return false;
           }
            manCount -= 1;
           $("#"+classM+"Count").text(manCount);
              }
        });
};

var man = new Dragger("man");
man.Init();

上面的代码运行得很好，但是当我初始化一个新对象时

    var man = new Dragger("man");
    man.Init();
    var girl = new Dragger("girl");
    girl.Init();

它总是选择女孩对象，有什么帮助我做错了吗？

它总是在拖动时返回我的女性对象。 显示截图：http://screensnapr.com/v/SrsyGz.png

这里有问题：http://screensnapr.com/v/hxrZYa.png

谢谢

编辑：

好的，我已经通过添加鼠标悬停事件解决了这个问题，我不确定它有多完美，因为我对它很陌生，但它可以按预期工作

$(".man").mouseover(function(){
  var man = new Dragger("man");
  man.Init();
});
$(".girl").mouseover(function(){
  var girl = new Dragger("girl");
  girl.Init();
});

Answer 1

可能是因为您在 Init 函数中调用了 $('#drop').droppable()，所以它在同一个元素上被多次启动 (#drop)。