Help us understand the problem. What is going on with this article?

jQuery で dataTransfer が見つからないよ

More than 5 years have passed since last update.

備忘録です.
jQuery で dataTransfer を使おうと思ったけど見つからないよと言われたので調べた時のメモです.

サンプルコード

sample.js
$("#sample").on("dragover", function(e) {
  e.preventDefault();
})
.on("drop", function(e) {
  e.preventDefault();

  // ないよー
  e.dataTransfer.items[0].getAsString(function(url) {
    console.log(url);
  }, false);
});

原因

jQuery’s event system normalizes the event object according to W3C standards. The event object is guaranteed to be passed to the event handler. Most properties from the original event are copied over and normalized to the new event object.
... http://api.jquery.com/category/events/event-object/

ドキュメントの文章を読んで分かる通り,
jQueryで定義したイベントハンドラを通じて取得したイベントオブジェクトは,
元のイベントオブジェクトの持つプロパティのうち,「ほとんど」をコピーした新しいイベントオブジェクトになっています.
つまり,この「ほとんど」の中に dataTransfer が入っていないことが原因でした.

解決法

その1 jQueryのイベントオブジェクトのプロパティにdataTransferを追加しちゃう.
jQuery.event.props.push("dataTransfer");

その2 originalEventプロパティを使って呼び出す.
e.originalEvent.dataTransfer.うんたらかんたら

ひとこと

全部ドキュメントに書いてました,ちゃんと読みます.

Why do not you register as a user and use Qiita more conveniently?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away