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/