получение только последнего класса, назначенного с помощью this.class

#javascript #jquery #prototype-oriented

#javascript #jquery #ориентированный на прототип

Вопрос:

Пожалуйста, кто-нибудь может увидеть, что не так в этом коде, у меня есть 2 изображения класса с .man и .girl, которые содержат по 10 изображений в каждом. далее у меня есть 2 div #manCount и #girlCount, которые отображают общее количество изображений (по 10 в каждом)

когда я перемещаю одно изображение в #drop, оно уменьшает 1 число от #manCount . Итак, всего 10 изображений с именем класса.человек, когда последнее изображение перемещается в #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();
  

Он всегда выбирает объект girl, любая помощь, где я делаю неправильно?

Он всегда возвращает мне женский объект при перетаскивании. Скриншот отображения: 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();
});
  

Комментарии:

1. Пожалуйста, используйте заглавные I буквы и буквы в начале предложений, чтобы повысить удобочитаемость.

2. Извините, исправил некоторые, буду заботиться дальше.

Ответ №1:

Возможно, это потому, что вы вызываете $('#drop').droppable() Init функцию, поэтому она запускается более одного раза для одного и того же элемента (#drop ).

Комментарии:

1. спасибо за информацию, я не уверен, что происходит, поскольку я новичок в jquery, я думаю, проблема в том, что я инициализирую оба класса одновременно, поэтому он выбрал только последний, поэтому он всегда уменьшает это последнее значение объекта. вот экран, что происходит screensnapr.com/v/hxrZYa.png

2. вероятно, вам следует вместо этого поместить логику в обратный вызов drop, чтобы избежать проблем с областью видимости.

3. Спасибо, я проверю, я только что нашел решение, инициализируйте объект только при наведении курсора мыши, не могли бы вы посмотреть выше и сказать мне, все ли в порядке, я довольно новичок в этой концепции. Еще раз спасибо.