프로젝트에서 jQueryUI를 드래그 가능하고 정렬 가능하게하는 방법은 무엇입니까?

Question

내 프로젝트에서 jQueryUI를 드래그 가능하고 정렬 가능하게 통합하고 mousedown 시작 시간과 첫 번째 mousemove 이벤트 사이의 시간차를 사용하여 구별하려고합니다. 내 코드의 일부는 다음과 같습니다 :

var deltaX = self.mouse.startX - event.pageX, 
    deltaY = self.mouse.startY - event.pageY; 
if (self.mouse.mousedownTime - self.mouse.mousemoveTime < 700){     
       // Drag down 
       if(Math.abs(deltaX) < Math.abs(deltaY) && deltaY < 0){ 
        $(self.el).draggable({disabled: false}); 
        $(self.el).sortable({disabled: true}); 
        $(self.el).draggable({axis: 'y'}); 
        $(self.el).draggable({revert: true}); 
.... 
} 
// Sorting action 
else { 
      $(self.el).sortable({disabled: false}); 
      $(self.el).draggable({disabled: true}); // global dragging 
      $(self.el).sortable({containment: $(self.el).closest('.content')}); 
     } 

그러나 나는 예상 한 바가 없습니다. 요소를 드래그하기 시작할 때마다 파이어 버그에 표시된 html은 적절한 드래그 가능/정렬 가능한 클래스 설정을 갖지만 현재 드래그 이벤트에는 효과적이지 않습니다. 예를 들어 처음으로 드래그하면 html에는 이미 해당 클래스 설정이 있지만 요소는 드래그 가능하거나 정렬 할 수 없습니다. 드래그 할 때 드래그하거나 정렬 할 수 있습니다. 현재 끌기 이벤트에 대해 드래그 가능/정렬 가능 요소를 설정하면 다음 드래그 할 때만 작동합니다.

즉, 현재 이벤트에 필요한 draggable/sortable 이벤트는 다음 이벤트에만 적용됩니다. jQueryUI가 있어야하는지 아니면 내 코드에 문제가 있는지 알고 싶습니다. 어떻게 수정해야합니까? 내 프로젝트에서 드래그 가능 및 정렬 가능 모두를 어떻게 통합해야합니까?

Answer 1

이것은 예상 된 동작으로, 요소에 플러그인을 연결하기 위해 예상되는 동작입니다. 드롭 될 때와 드래그 될 곳을 청취해야합니다.

일반적으로이 두 플러그인은 나란히 작동합니다. 따라서 요소를 드래그 할 수 없게 만들지 않고도 이렇게 할 수있는 방법이 있다고 생각하지 않습니다.