可拖動在Firefox

Question

JSFiddle

慘遭失敗。在這個簡單的例子，你應該能夠拖動紅色框爲虛線區域。它適用於IE和Chrome，但不適用於Firefox。真奇怪的是dragstart事件觸發（導致元素被隱藏），然而沒有其他事情發生 - 甚至沒有發生dragend（將其隱藏並隨後不可用）。

var source = null; 
document.getElementById('drag').addEventListener("dragstart",function(e) { 
    source = this; 
    e.dataTransfer.clearData(); 
    e.dataTransfer.effectAllowed = "move"; 
    setTimeout(function() {source.style.visibility = "hidden";},1); 
}); 
document.getElementById('drag').addEventListener("dragend",function(e) { 
    this.style.visibility = ""; 
    source = null; 
}); 
document.getElementById('drop').addEventListener("dragenter",function(e) { 
    if(source) { 
    if(e.preventDefault) e.preventDefault(); 
    return false; 
    } 
}); 
document.getElementById('drop').addEventListener("dragover",function(e) { 
    if(source) { 
    if(e.preventDefault) e.preventDefault(); 
    return false; 
    } 
}); 
document.getElementById('drop').addEventListener("drop",function(e) { 
    if(source) { 
    this.appendChild(source); 
    source = null; 
    } 
}); 

我知道這個代碼是不是最有效（的getElementById過度時，我應該只使用一次，複製粘貼回調dragenter/dragover），但它跨越獲取點。

我做錯了什麼？

Answer 1

修訂

按這篇文章here，我相信這個問題是此行

e.dataTransfer.setData('Text',''); //you need this so that your code will work on Firefox. 

在此JSFiddle