jquery拖放添加類

Question

我正在嘗試這樣做：當您將粉紅色框拖入拖放區域時，粉紅色框變爲藍色。

通過在jquery中添加一個類或css。

目前爲止的代碼。所以，「每個」是粉紅色的，我想一個類添加到這個曾經是已在預覽

$('.page').click(function(){ 
     $(this).draggable({ 
      revert: "invalid", // when not dropped, the item will revert back to its initial position 
      cursor: "move" 
     }); 
    }); 

    $(".preview").droppable(); 

Answer 1

這裏被丟棄對方向

function init() { 
    $('#mydraggable').draggable(); 
    $('#mydroppable').droppable({ 
    drop: handleDropEvent 
    }); 
} 

function handleDropEvent(event, ui) { 
    if(/*check that the dropped element is pink*/) { 
    // $yourpinkbox.addClass("blueclass"); 
} 

} 

Answer 2

一些例子在droppable.drop功能的回調做到以下幾點：

$(ui.draggable).removeClass("pink").addClass("blue"); 

全碼：

CSS

.pink { 
    background: pink; 
} 

.blue { 
    background: blue; 
} 

的Javascript

$(function() { 
     $("#draggable").draggable(); 
     $("#droppable").droppable({ 
      drop: function (event, ui) { 
       $(ui.draggable).removeClass("pink").addClass("blue"); 
      } 
     }); 
    }); 

例：http://jsfiddle.net/vQs2L/1/