Question

我尝试使用html5拖放api，它在Windows机器上的我的chrome 20.0.1132上工作得非常好，但最有趣的是 - 在mac os lion上相同版本的chrome无效。我的意思是dragstart正在工作，但是drop事件，dragleave，dragover并没有被解雇。这是html：

<form id="fake_form" action="#" >
            <div id="canvas_wrapper" style="overflow: hidden;width: 600px; position: relative;border: 1px solid black; margin-left: 30px;">
                <canvas width="600" height="300" >
                </canvas>
            </div>
 </form>

这是javascript：

    var canvas = $('canvas')[0];
    canvas.addEventListener('dragenter', function(e){
        console.log('dragenter');
    }, false);
    canvas.addEventListener('dragleave', function(){
        console.log('dragleave');
    }, false)
    canvas.addEventListener('dragover', function(e){
        console.log('dragover');
        if(e.preventDefault){
            e.preventDefault();
        }
        return false;
    }, false);
    canvas.ondrop = function(e){
        console.log('ondrop');
    /** OTHER CODE **/

如果有帮助：在相同的Mac上进行safari - 它可以工作，我拖动图像标签，其中一些具有可拖动的属性，其中一些 - 不是。刚刚检查 - 金丝雀Mac版22它可以工作。

更新：我发现如果我删除行有一些魔法与dragstart事件这个e.dataTransfer.setData('src', src_var)每个人都会工作

Answer 1

解决此问题的方法 - 当您使用e.dataTransfer.setData时，第一个参数应该是正确的mime类型，我将其更改为text/plain并且一切都正常工作

删除无法使用Chrome Mac版本

1 个答案: