相关疑难解决方法(0)

HTML5 DnD dataTransfer setData或getData在除Firefox之外的每个浏览器中都不起作用

考虑一下这个JSFiddle.它在Firefox(14.0.1)中工作正常,但在Windows(7)和OS X(10.8)上的Chrome(21.0.1180.75),Safari(?)和Opera(12.01?)都失败了.据我所知,问题在于对象上的setData()或者getData()方法dataTransfer.这是JSFiddle的相关代码.

var dragStartHandler = function (e) {
    e.originalEvent.dataTransfer.effectAllowed = "move";
    e.originalEvent.dataTransfer.setData("text/plain", this.id);
};

var dragEnterHandler = function (e) {
    //  dataTransferValue is a global variable declared higher up.
    //  No, I don't want to hear about why global variables are evil,
    //  that's not my issue.
    dataTransferValue = e.originalEvent.dataTransfer.getData("text/plain");

    console.log(dataTransferValue);
};
Run Code Online (Sandbox Code Playgroud)

据我所知,这应该可以正常工作,如果你在拖动项目的同时查看控制台,你会看到写出的id,这意味着它正好找到了元素并抓住了它的id属性.问题是,它是不是设置数据还是没有获取数据?

我很欣赏这些建议,因为经过一周的努力,经过三次尝试和200多个版本,我开始放松心情.我所知道的是它曾经在60左右的版本中工作,而且具体的代码根本没有改变......

实际上,6X和124之间的主要区别之一是我将事件绑定从更改live()on().我不认为这是问题所在,但是在谈到DnD时,我已经看到Chrome出现了几次失败.这已经被揭穿了.事件绑定方法对此问题没有影响.

UPDATE

我已经创建了一个新的JSFiddle,它完全消除了所有内容,只留下了事件绑定和处理程序.我用jQuery 1.7.2和1.8既测试了它on()live().问题持续存在,因此我删除了一个级别并删除了所有框架并使用了纯JavaScript.这个问题仍然 …

javascript jquery html5 drag-and-drop

40
推荐指数
4
解决办法
4万
查看次数

标签 统计

drag-and-drop ×1

html5 ×1

javascript ×1

jquery ×1