jquery - HTML 5のevent.originalEvent.dataTransfer.filesとevent.dataTransfer.filesの違い

Question

違いは何ですか

event.originalEvent.dataTransfer.files

と

event.dataTransfer.files

???

ドラッグアンドドロップでは、2番目のコードが機能せず、未定義であるため、最初のコードを使用する必要がありました。

Answer 1

jQuery はブラウザ イベント オブジェクトを渡すのではなく、jQuery イベント オブジェクトを渡します。.originalEventjQuery イベント オブジェクト内のプロパティによって、元の変更されていないイベント オブジェクトにアクセスできます。その後、通常どおり続行できます。

コードでは：

jQuery イベント モデル:

$(document).on("drop dragend dragstart dragenter dragleave drag dragover", function(event) {
    event.preventDefault();
    if (event.type === "drop") {
        alert(event.originalEvent.dataTransfer.files);
    }
});

W3C イベント モデル:

function preventDefault(event) {
    event.preventDefault();
}

function alertFiles(event) {
    alert(event.dataTransfer.files);
}
document.addEventListener("dragstart", preventDefault, false);
document.addEventListener("dragenter", preventDefault, false);
document.addEventListener("dragleave", preventDefault, false);
document.addEventListener("drag", preventDefault, false);
document.addEventListener("dragend", preventDefault, false);
document.addEventListener("dragover", preventDefault, false);
document.addEventListener("drop", preventDefault, false);
document.addEventListener("drop", alertFiles, false);