Firefox에서 사이드 바 또는 개발자 패널 위로 마우스 버튼을 놓을 때 드래그 가능하거나 정렬 가능한 요소의 jQuery UI를 "놓으십시오"?

Question

나는 웹 애플리케이션에서 사용자가 jQuery UI의 Sortable 및 Droppable 위젯을 통해 화면의 항목을 재정렬하고 삭제할 수 있도록하고있다. 처음에는 항목을 삭제하는 한 가지 방법 만 제공했습니다. 휴지통 아이콘이있는 영역으로 드래그하여 놓습니다. 이제 항목을 화면 가장자리에서 드래그하여 마우스 버튼을 놓아 삭제하는 옵션을 추가합니다.

이 새로운 기능 (화면을 드래그하여 삭제)은 내가 예상했던 것보다 조금 더 복잡해졌지만 마침내 대부분의 문제가 해결되었습니다. 한가지는 여전히 나에게 충격을주고있다. 파이어 폭스에서는 메인 브라우저 창 외에 브라우저에 다른 "패널"이있을 때 드래그 앤 드롭 기능에 문제가있다. 예를 들어, 즐겨 찾기 사이드 바 (일반적으로 고정되어있다. 왼쪽) 및 개발자 도구 (일반적으로 오른쪽 또는 아래쪽에 고정되어 있음)를 선택합니다. 정렬 가능한 요소를 선택하여이 패널 중 하나 뒤에 드래그하고 마우스 버튼을 놓으면 jQuery UI가 요소를 계속 유지 (즉 드래그 유지)합니다. jQuery UI Sortable 페이지

1. 이동 : 문제를 재현하는 방법
   .
2. [control-B] 키를 눌러 Firefox의 책갈피 사이드 바를 표시하십시오.
3. 정렬 가능한 항목 중 하나를 잡고 북마크 사이드 바 위로 드래그 한 다음 마우스 버튼을 놓습니다.
4. 마우스를 해당 항목이 나온 상자로 다시 이동하십시오. 더 이상 마우스 버튼을 누르지 않아도 드래그되는 것처럼 항목이 마우스에 계속 고착되어있는 것을 볼 수 있습니다.

원하는 동작 : 난 당신이 브라우저 외부에서 완전히 포인터를 이동하고 마우스 버튼을 떼면는 않습니다 만대로 정렬 가능한 위젯이 정렬 항목을 해제 할 수 있습니다.

이 문제는 Firefox에서만 발생합니다. (Firefox 51.0.1을 실행하고 있습니다.) Google 크롬에는 동일한 문제가 없습니다. (Google Chrome의 개발자 도구를 아래쪽이나 오른쪽으로 도킹하면 dev-tools 영역을 통해 정렬 가능한 항목을 릴리스 할 수 있으며 원하는 동작을 얻을 수 있습니다.) IE, Safari 또는 기타에서 테스트하지 않았습니다. 아직 브라우저가 없습니다.

미리 도움 주셔서 감사합니다.

Answer 1

음, 몇 년 전에이 문제가 발생했습니다. 내가 몸 밖으로 나왔다면 나는 커서를 놓았다. 여기

는 드래그에 대한 솔루션입니다 : 여기

var flag=true; 
start: function(event, ui){ 
    if(flag){ 
     flag = false; 
     $('body').one("mouseleave", function(){ 
      $('body').one("mouseup", function(){ 
       flag = true; //event occured, rebind 
       //do your stuff 
       }); 
      }); 
    } 
    else{ 
     flag = false; 
    } 
} 

가 question