jQuery UI 정렬 가능 - 시작시 무언가 수행하고 드롭시 제거

Question

두 개의 블록 중 하나는 "드래그 가능"이고 다른 하나는 "정렬 가능"입니다.

"sortable"에서 항목을 드래그하기 시작할 때 div에 배경색을 추가하고 끌기를 멈 추면 배경색을 제거하고 싶습니다.

$(".sortableList").sortable({ 
start: function(event, ui) { 

    if (event.handleObj.namespace=="sortable") 
     $('.background').show(); 
    }, 

update: function(event, ui) { 

    if (event.handleObj.namespace=="sortable") 
     $('.background').hide(); 
    } 


}); 
$(".draggable").draggable({ 
connectToSortable: '.sortableList', 
cursor: 'pointer', 
helper: 'clone', 
revert: 'invalid', 
start: function (event, ui) { 
    $(this).addClass('testing'); 
} 
}); 

가 여기에 내가 할 노력하고있어의 라이브 예를 들어 jsbin입니다 :

여기 내 JS입니다.

문제는 "정렬 가능"항목을 드래그하여 같은 위치에 놓을 때 배경색이 동일하고 예상하지 못하는 것입니다.

어떻게하면됩니까?

Answer 1

대신 update 이벤트의 stop 이벤트 사용하면 [문서]와 시간 (http://api.jqueryui.com/sortable/) 당신이 할 수 있습니다을 보낸 경우

$(".sortableList").sortable({ 
start: function(event, ui) { 

    if (event.handleObj.namespace=="sortable") 
     $('.background').show(); 
    }, 

stop: function(event, ui) { 

    if (event.handleObj.namespace=="sortable") 
     $('.background').hide(); 
    } 


});