14

ドラッグ＆ドロップについて勉強中です。JSFiddleにある W3Schools の例をコピーしました。

W3School の例でpreventDefault()は、ドロップ イベントで次のように呼び出します。

function drop(ev) {
    ev.preventDefault();
    var data=ev.dataTransfer.getData("Text");
    ev.target.appendChild(document.getElementById(data));
}

それでも、ドキュメントを読むときの必要性がわかりません。この呼び出しを削除しても、例は引き続き正常に動作します。

function drop(ev) {
    var data=ev.dataTransfer.getData("Text");
    ev.target.appendChild(document.getElementById(data));
}

では、この への呼び出しは何に使用されるのpreventDefault()でしょうか。本当に必要ですか？はいの場合、なぜですか？

4

3 に答える 3

22

これは、何が起こっているかを完全に制御できるようにするための方法であるため、ドラッグ アンド ドロップ API 仕様のブラウザー固有の実装が機能しないことを確認できないため、そのままにしておくことは問題ありません。 、たとえばここに見られるように（強調鉱山）

ondrop を起動するには、ondragenter と ondragover のデフォルト アクションをキャンセルする必要があります。div の場合、デフォルトのアクションは drop ではありません。これは、デフォルトのアクションがドロップである input type=text 要素の場合と対照的です。div でのドラッグ アンド ドロップ アクションを許可するには、デフォルトのアクションをキャンセルする必要があります

注: リンクされた例では、実際にはe.preventDefault;を使用していません。古い IE 固有のメソッドを使用しますがwindow.event.returnValue=false、これは以下と同じ効果があります。e.preventDefault

したがって、多くの場合、違いはありませんが、一部のユーザーのケースをカバーするために、とにかくそれを含める必要があると言いたいと思います.

于 2013-10-02T09:36:51.747 に答える
1

必要かどうかを確認するために、すべての異なるブラウザで試してみてください。この単純なサンプルではわからないと思いますが、フォームの一部である場合は、クリックの泡立ちを防ぐ必要があることがわかります。

于 2013-10-02T08:57:21.723 に答える