2012-10-22 1 views
0

현재 HTML5 드래그 앤 드롭 API를 실험하고 있습니다. 이제 몇 가지 질문이 있습니다.여러 드롭 대상, dropEffect, 다중 선택 등을 사용하는 HTML5 드래그 앤 드롭

1. 드래그 가능한 요소를 놓기 영역에 연결할 수 없습니까?

예 : 끌어서 놓기를 원하는 두 가지 종류의 요소가 있습니다 (파일 및 텍스트 레이블). 이제 일부 div에 DragOver-Handler와 Drop-Handler를 지정하면 파일과 텍스트 레이블에 모두 응답합니다. 특정 유형의 드래그 가능한 항목에만 응답 할 수있는 간단한 가능성을 찾고 있습니다.

연결된 문제는 dropEffect 커서 스타일입니다. 현재 DragStart-Handler에서 가능한 모든 드롭 대상을 활성화하고 DragEnd-Handler에서 해당 항목을 모두 비활성화합니다 ("사용 안 함"은 내가 제거한다는 의미입니다. 모든 드래그 오버 및 드롭 처리기). 그렇게하지 않으면 텍스트 레이블에만 반응해야하는 요소에 파일을 놓을 수있는 것처럼 보입니다.

2. dropEffect 커서 스타일은 엉망입니다. 파이어 폭스에서, 나는 그것들을 전혀 얻지 못한다. Chrome에서는 큰 "plus"-icon을 줄 것이다. (요소에서 DragOver와 Drop-Handler를 제거했다하더라도)

3. 마지막 기능 내가 찾고있는 다중 선택 : 여러 텍스트 레이블을 선택하고 한 번에 모두를 드래그하십시오. 이것이 가능한가? 내 첫 번째 아이디어는 새로운 div를 만들고이 div 안에 선택된 모든 요소를 ​​이동 한 다음 새로 만든 div를 드래그하는 것이 었습니다. 꽤 hackish 보인다 꽤 못생긴 ;-)

나는 너희들이 나를 위해 몇 가지 해답을 갖기를 바랍니다. 감사!

답변

1

HTML5 드래그 앤 드롭 (및 친구들)이 일반적으로 사용되는 "드래그 앤 드롭"자바 스크립트 라이브러리 (일부 경우에는 대신 사용될 수 있음)의 대체품으로 생각되지 않습니다. 이름은 오해의 소지가 있습니다.

최신 운영 체제에는 응용 프로그램 간 통신 (클립 보드 및 끌어서 놓기)을 허용하는 API가 포함되어 있습니다.

  • 가 보낸 사람이하는 방법 방법이 있어야합니다,

    • 데이터가 프로세스를 통해 전송해야한다, 그래서 어떻게 든 직렬화해야합니다 : 두 API는 매우 유사하고 있기 때문에 특정 과제의 매우 낮은 수준 일 필요 많은 형식 (예 : text/plain 및 text/html)으로 데이터를 제공하고 수신자는 자신이 가장 좋아하는 것을 고르는 기능을 제공합니다.
    • 발신자와 수신자가 다른 프로세스에서 살아있을 수 있으므로 결코 알 수 없습니다 서로 (다른 플랫폼, GUI 프레임 워크, 프로그래밍 언어 등에서 온 엔터티 일 수도 있습니다.) 유일한 통신 채널은 데이터 자체입니다.

    현재 HTML5 APIS는 말하자면 JQueryUI draggables와 달리 드래그 프로세스의 모양과 느낌을 엄격하게 제어하기보다는 고유 시스템 전체 메커니즘과 긴밀하게 통합 할 수 있습니다. 프로그래머가 필요로하는 것이거나 그렇지 않을 수도 있습니다.

    그래서 질문에 대답 : 당신은 "드롭 영역으로 드래그 할 수있는 요소를 연결할 수 없습니다"

    1. , 당신의 드래그 요소도 브라우저 외부에서 올 수 있기 때문이다. 하지만 특정 유형의 데이터 (사용자가 기본 드래그 앤 드롭으로 예상하는 데이터)를 거부하는 영역을 만들 수 있습니다.
    2. "div"및 "multiselect"는 운영 체제에서 이해할 수있는 것이 아닙니다 (고유 한 다중 클립 보드 또는 다중 텍스트 선택이 없음). 내부 div를 토글 (예 : Shift를 누른 상태에서 클릭하여) 할 수 있다면 이러한 기능을 구현할 수 있습니다. 누군가 외부 다이빙을 드래그하려고하면 내부 div가 선택되었다는 것을 나타내는 전송 객체를 만듭니다 (심지어 이미지를 나타내는 이미지를 만들 수도 있습니다).

    위의 해결 방법이 약간 낮은 수준으로 들리는 경우, 그게 좋기 때문입니다. 데스크톱 게임이나 도구를 개발할 때 GUI에서 체스 보드 또는 움직이는 슬라이더를 통해 움직이는 조각에 대한 기본 드래그 앤 드롭에 의존하지 않습니다. 나는 JavaScript와 동일하다고 생각한다. JQueryUI Draggables는 어디에도 없습니다.