HTML5 拖放 - 使用 jQuery 处理事件答案

【问题标题】：HTML5 Drag&Drop - Event handling with jQueryHTML5 拖放 - 使用 jQuery 处理事件
【发布时间】：2015-03-26 15:06:55
【问题描述】：

所以我多次偶然发现这个问题，现在我终于厌倦了这个话题。每次搜索和谷歌搜索都会让我感到困惑，现在我需要自己在这里问。

我准备在 Web 应用程序中实现原生 HTML5 拖放。它在 Chrome 和 IE 中也可以正常工作（至少在我上次尝试时）。

现在的问题是，通过 jQuery 进行的事件绑定在 Firefox 中无法正常工作，而在 Chrome 中却可以！这是我的代码：

$(document).on('dragstart','.leistung', function(){
    cedamed.handlers.dragElement(event);
});

这是我的处理程序：

this.dragElement = function(event){
    var dataObj = {}; 
    dataObj.category = event.target.getAttribute('class');
    dataObj.description = event.target.getAttribute('description');
    dataObj.code0 = event.target.getAttribute('code0');
    dataObj.code1 = event.target.getAttribute('code1');
    dataObj.code2 = event.target.getAttribute('code2');
    event.dataTransfer.setData('Text',JSON.stringify(dataObj));
    console.log("dragging");
};

在 Chrome 中工作，Firefox 给我以下错误：

ReferenceError: event is not defined

它指向以下行：

cedamed.handlers.dragElement(event);

我遇到了涉及事件 api 的 originalEvent 属性的“解决方案”，这通常应该使 FF 中的一切正常，但在我的情况下根本没有。我通过直接在 HTML 中设置“ondragstart”属性使其工作，但它不应该与“jQuery.on”一起工作吗？

对不起，这个话题有几个问题，但我只是不明白这个领域出了什么问题。你能给我一个见解，这里有什么问题吗？

【问题讨论】：

标签： javascript jquery html oledragdrop

【解决方案1】：

我发现我必须将'event'作为参数传递给'on'中的jQuery回调函数，例如：

$(document).on('dragstart','.leistung', function(event){
   cedamed.handlers.dragElement(event);
});

在 'drageElement' 中使用 originalEvent 后，我终于让它工作了。对不起...

【讨论】：