jQuery将元素传递给dataTransfer属性

Question

尝试dataTransfer在拖放序列期间将jQuery对象传递给属性.将属性添加到jQuert.event.props数组后我可以分配它,但它在drop事件期间返回undefined .不知道我在这里缺少什么 - 看起来真的很简单.

使用Javascript:

function dragClip(clip, event){

    event.dataTransfer.el = clip;

    /* Console confirms event.dataTransfer.el is the jQuery object */
}

function dropClip(target, event){

    target.append(event.dataTransfer.el);

    /* event.dataTransfer.el no longer has the object... where'd it go?? */
}

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

$('#titles')
    .bind('dragenter dragover', false)
    .bind('drop', function(event){

        dropClip($(this), event);
    });

$('.clip').bind('dragstart', function(event){

    dragClip($(this), event);
});

---

更新:

重写以删除冗长.已经包含了其他东西,但匿名函数会做得很好:

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

$('#titles')
    .bind('dragenter dragover', false)
    .bind('drop', function(event){

        $(this).append(event.dataTransfer.el);
    });

$('.clip').bind('dragstart', function(event){

    event.dataTransfer.el = $(this);
});

---

UPDATE

根据@ barney的最终答案,我的最终工作代码.我注意到使用原始事件不允许我将对象作为数据传递,因此我应用了ID并在drop上重建了jQuery对象.通过摆脱声明的功能也收紧了一切.代码少,结果相同.

$('#titles')
    .bind('dragenter dragover', false)
    .bind('drop', function(event){

        $(this).append($('#' + event.originalEvent.dataTransfer.getData('clip')));
    });

$('.clip')
    .bind('dragstart', function(event){

        event.originalEvent.dataTransfer.setData('clip', $(this).attr('id'));
    });

Answer 1

就个人而言,我尝试尽可能少地使用jQuery内部,并在可能的情况下提取原始事件对象.在过去使用拖放时,我总是使用event.originalEvent.dataTransfer.