javascript - 使用 jquery draggable/droppable 通过类定位特定的 div

Question

当使用 jquery UI 拖动一个 div 并将其放入一个 UI 可放置的 div 时，我想在 div 被放入该区域时触发一个 jquery 动画。当动画被触发时，它会在所有带有 class = "drag-element"的 div 上调用，但我只想对特定的拖放元素进行动画处理。我已经尝试包括 removeClass(".drag-element") 和 addClass(".animate-element") 并告诉 animate() 对此采取行动，但它仍在将动画应用于所有 .drag-element div。我该如何解决这个问题？

JQuery:

$(function() {
$( ".drag-element" ).draggable({ containment: ".container" }).removeClass(".drag-vid");
$( ".drop-field" ).droppable({
  drop: function( event, ui ) {
    $(".drag-element").animate({"left": "+=50px"}, "slow");
    $( this )
      .css("background-color", "silver");
  }
});
});

http://jsfiddle.net/NBHMT/

Answer 1

使用:

ui.draggable.animate({"left": "+=50px"}, "slow");

代替:

$(".drag-element").animate({"left": "+=50px"}, "slow");

http://jsfiddle.net/kAG6q/

当您调用 $(".drag-element").animate(.... 它会选择所有拖动元素 div。相反，drop 函数有一个 ui使用 ui.draggable

为您提供有关拖动元素的信息的参数