Свяжите собственный обработчик событий html5 dragstart и получите доступ к dataTransfer, используя jQuery

Question

Это работает:

$(".my_dragging_class").each( makeDraggable($(this).get()[0]) );

var makeDraggable = function (el){
    el.draggable = 'true';
    el.addEventListener('dragstart', function(e){
                e.dataTransfer.effectAllowed = 'move';
                e.dataTransfer.setData('text/html', 'test');
                console.log('dragstart');
                }, 
            false);
}

Это НЕ работает:

$(".my_dragging_class").makeDraggable();

$.fn.makeDraggable(){
    $(this).attr('draggable','true');
    $(this).bind('dragstart', function(e){
                e.dataTransfer.effectAllowed = 'move';
                e.dataTransfer.setData('text/html', 'test');
                console.log('dragstart');
                }, 
            false);
}

Сообщение об ошибке: Я получаю 'e.dataTransfer не определен' для строки e.dataTransfer.effectAllowed = 'move';. Мой браузер FireFox 10.0.2

Можно ли использовать dataTransfer с jQuery таким образом?

Answer 1

Попробуйте:

$.fn.makeDraggable(){
    $(this).attr('draggable','true');
    $(this).bind('dragstart', function(e){
                e.originalEvent.dataTransfer.effectAllowed = 'move';
                e.originalEvent.dataTransfer.setData('text/html', 'test');
                console.log('dragstart');
                }, 
            false);
}

Объект события jQuery не имеет свойства dataTransfer.

Answer 2

Объект события jQuery не имеет свойства dataTransfer ... true, но можно попробовать:

jQuery.event.props.push('dataTransfer');

kr, zara