2

現在、HTML5 ドラッグ アンド ドロップ API を試しています。今、私はいくつかの質問があります：

1. ドラッグ可能な要素をドロップ領域に接続できないというのは正しいですか?

例: ドラッグ アンド ドロップできるようにしたい 2 種類の要素があります: ファイルとテキスト ラベル。ここで、div に DragOver-Handler と Drop-Handler を指定すると、ファイルとテキスト ラベルの両方に応答します。特定のタイプのドラッグ可能なアイテムにのみ応答する簡単な可能性を探しています。

関連する問題は、dropEffect カーソル スタイルです。現時点では、DragStart-Handler で可能なすべてのドロップ ターゲットを有効にし、DragEnd-Handler でそれらすべてを無効にします (「無効」とは、すべての DragOver とドロップハンドラー)。そうしないと、テキストラベルにのみ反応する要素にファイルをドロップできるようになります。

2. dropEffect のカーソル スタイルがめちゃくちゃです。Firefoxではまったく取得できません.Chromeでは、大きな「プラス」アイコンが表示されます（要素からDragOverおよびDrop-Handlersを削除した場合でも）

3. 私が探している最後の機能は複数選択です。複数のテキスト ラベルを選択し、一度にすべてをドラッグします。これは可能ですか？私の最初のアイデアは、新しい div を作成し、選択したすべての要素をこの div 内に移動してから、新しく作成した div をドラッグすることでした。かなりハックに見えて、かなり醜いです ;-)

皆さんが私に答えてくれることを願っています。ありがとう！

4

1 に答える 1

2

私は、HTML5 のドラッグ アンド ドロップ (およびその仲間) が、一般的に使用される "ドラッグ アンド ドロップ" Javascript ライブラリの代わりになるとは考えていません (場合によっては、それらの代わりに使用することもできますが)。名前は誤解を招くものです。

最新のオペレーティング システムには、クリップボードやドラッグ アンド ドロップなど、アプリケーション間の通信を可能にする API が含まれています。両方の API は非常に似ており、特定の課題があるため、非常に低レベルである必要があります。

  • データはプロセス間で送信する必要があるため、何らかの方法でシリアル化する必要があります。
  • 送信者は多くの形式 (例: text/plain および text/html) でデータを提供する方法を備えている必要があり、受信者は最も気に入った形式を選択できる必要があります。
  • 送信者と受信者は異なるプロセスに存在する可能性があるため、お互いを知ることはできません (異なるプラットフォーム、GUI フレームワーク、プログラミング言語などからのエンティティでさえある可能性があります)。通信の唯一のチャネルはデータ自体です。

現在の HTML5 API は、たとえば JQueryUI のドラッグ可能なものとは対照的に、プログラマーがドラッグ プロセスのルック アンド フィールを厳密に制御できるようにすることを意図したものではなく、ネイティブのシステム全体のメカニズムとの緊密な統合を可能にするものです。これは、プログラマが必要とするものである場合とそうでない場合があります。

質問に答えるには：

  1. ドラッグ可能な要素をブラウザの外部から取得することもできるため、「ドラッグ可能な要素をドロップ領域に接続する」ことはできません。ただし、特定のタイプのデータを拒否する領域を作成できます (これは、ユーザーがネイティブのドラッグ アンド ドロップに期待するものです)。
  2. 「div」と「multiselect」は、オペレーティング システムが理解できるものではありません (ネイティブのマルチクリップボードや複数テキスト選択はありません)。切り替えることができる内部 div を作成すると、そのような機能を実装できます (たとえば、Shift キーを押しながらクリックすることによって)。誰かが外側のダイブをドラッグしようとすると、どの内側の div が選択されたかを示す転送オブジェクトを作成します (それらを示す画像を作成することもできます)。

上記の解決策が少し低レベルに聞こえる場合は、それが原因です。デスクトップ ゲームまたはツールを開発する場合、チェス盤上で駒を動かしたり、GUI でスライダーを動かしたりするために、ネイティブのドラッグ アンド ドロップに依存しません。JavaScriptでも同じだと思います。JQueryUI Draggables はどこにも行きません。

于 2012-11-28T20:34:05.717 に答える