jQuery 드래그 앤 드롭이 작동하지 않습니다.

Question

간단한 드래그 앤 드롭 '게임'을 개발하려고합니다. 간단히 말해서 다양한 항목을 특정 영역으로 끌어서 놓기 만하면 드래그 한 항목에 따라 정확하거나 잘못 표시됩니다. 이것은 내가 지금까지 가지고있는 것이고 전혀 작동하지 않는 이유이며, 나는 그 이유를 모른다. JS와 jQuery에 대한 나의 지식은 많이 필요하다.

<script> 
$(function() { 
    $("#draggable").draggable(); 
    $("#wrong").draggable(); 

    $("#droppable").droppable({  
     drop: function(event, ui) { 
      var currentId = $(this).attr('id'); 
      if (currentId == "draggable") { 
       $(this) 
        .addClass("highlight") 
        .find("p") 
        .html("Correct! :)"); 
      } else { 
       $(this) 
        .find("p") 
        .html("Wrong! :("); 
      } 
     } 
    }); 
}); 
</script> 

지금 나는 내가 드래그 이미지 이상의 인스턴스를 필요로 일하고 있다고하지만 난 더 추가 할 때 추가 된 새로운 작동하지 않습니다.

http://jsfiddle.net/KcruJ/9/

Answer 1

var currentId = $(this).attr('id'); 
if (currentId == "draggable") 
    ... 

$(this) represents the droppable the draggable is dropped on. ui.draggable represents the draggable는 [1]

에 한번 같이

이 사실을 초래할하지 않습니다 :

var currentId = $(ui.draggable).attr('id'); 
if (currentId == "draggable") 
    ... 

Answer 2

이 작동 : http://jsfiddle.net/T6nu3/2/

---

$(this).attr('id'); 

항상 droppable을 반환합니다. 당신은 드래그 요소에 액세스해야합니다

$(ui.draggable).attr('id'); 

자세한 내용은 jQuery UI Documentation 살펴보십시오합니다.

코드 :는

$(function() { 
    $("#draggable").draggable(); 
    $("#wrong").draggable(); 

    $("#droppable").droppable({ 
     drop: function(event, ui) { 
      var currentId = $(ui.draggable).attr('id'); 
      if (currentId == "draggable") { 
       $(this).addClass("highlight").find("p").html("Correct! :)"); 
      } else { 
       $(this).find("p").html("Wrong! :("); 
      } 
     } 
    }); 
}); 

Answer 3

하하 아니라, 알렉스는 잠금이 하나가 보인다.

답이있다 : http://jsfiddle.net/aGqHh/1/