jQuery draggable이 2 개의 droppables에 떨어졌습니다. 하나만 필요합니다

Question

jQueryUI (가장 최근 버전)에서 드래그 앤 드롭으로 약간의 문제가 있습니다.

저는 드래그 가능한 제품을 가지고 있습니다. 두 개의 드롭 위치가 있지만 부모 - 자식이 아닙니다.

첫 번째 droppable은 두 번째 위쪽 바로 위에 있습니다. 두 번째 droppable은 스크롤 할 수있는 div 안에 있습니다. 문제는 div가 조금 아래로 스크롤했을 때 발생합니다. div가 스크롤되면 두 번째 droppable이 효과적으로 위쪽으로 이동하지만 숨겨집니다.

Chrome에서 요소 검사기를 사용하면 강조 표시되는 것을 볼 수 있습니다.

이제 첫 번째에 draggable을 놓으면 두 가지 droppables 모두 해고됩니다.하지만 첫 번째 것은 시작하기를 원합니다.

"greedy : true"를 사용하면 부모님이 아니기 때문에 작동하지 않는 것 같습니다.

해고 된 순서는 예측 가능합니다. 첫 번째 (눈에 보이는 드롭 가능)가 먼저 시작되고 두 번째 (실제로 볼 수 없음)입니다.

두 번째 droppable이 발생하지 않도록하는 방법이 있습니까?

1) 페이지의 요소를 이동 중첩 더 이상 존재하지 않는 것과 같은 방법이다 :

jsfiddle example 

http://jsfiddle.net/vQuZf/1/

Answer 1

그것에 추가 비트를보고하는 데, I 2 개 가능한 솔루션은 존재 발견 . 이렇게하면 "더블 드롭"을 얻지 못합니다.

2) 드롭 할 때 실행되는 사용자 지정 코드를 드롭 식에 추가하십시오. 마지막으로 삭제 된 타임 스탬프가있는 삭제 된 요소를 표시해야합니다. 다른 요소는 이것을 검사 할 수 있으며 X 초 내에 떨어 뜨린 경우 드롭을 무시해야합니다.

솔루션 2의 경우 구현이 다를 수 있지만 첫 번째 요소가 놓은 요소를 표시해야만 두 번째 요소가이를 확인할 수 있다는 점에서 모두 유사합니다.

내 경우에는 솔루션 번호 1을 사용했습니다. 어쨌든 가장 좋은 솔루션은 페이지의 더 나은 레이아웃으로 밝혀졌습니다.