ondragstart event with jQuery

Question

I've been trying to use Javascript Drag and Drop API.

var file = document.getElementById('file');
file.addEventListener('dragstart', function(evt){
  evt.dataTransfer.setData("DownloadURL",fileDetails);
}, false);

That works and all, but is there any way to use jQuery "on" to catch the event? I've tried

$('#file').on('dragstart', function(evt) {
   console.log(evt.dataTransfer);                    // this returns undefined
   evt.dataTransfer.data("DownloadURL",fileDetails); // so this produces error
});

But it doesn't work.

If possible, I don't want to use jQuery draggable plugin, since I'm not really looking to have a cross-browser solution.

Thanks

Answer 1

You have to use the property originalEvent of the jquery event to access native properties of the javascript listener, like this:

evt.originalEvent.dataTransfer