绑定本机html5 dragstart事件处理程序并使用jQuery访问dataTransfer [英] Bind native html5 dragstart event handler and access dataTransfer using jQuery

问题描述

这是正常工作：

$(".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 is undefined' for the line e.dataTransfer.effectAllowed ='move'; 。我的浏览器是FireFox 10.0.2

Error message: I receive a 'e.dataTransfer is undefined' for the line e.dataTransfer.effectAllowed = 'move';. My Browser is FireFox 10.0.2

可以用jQuery这种方式使用dataTransfer吗？

Is it possible to use dataTransfer with jQuery this way?

推荐答案

尝试：

$.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 属性。

这篇关于绑定本机html5 dragstart事件处理程序并使用jQuery访问dataTransfer的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！