HTML5 dragend事件觸發立即

我有幾個元素拖動HTML5 dragend事件觸發立即

<div Class="question-item" draggable="true">Box 1: Milk was a bad choice.</div> 
<div class="question-item" draggable="true">Box 2: I'm Ron Burgundy?</div> 
<div class="question-item" draggable="true">Box 3: You ate the entire wheel of cheese?  </div> 
<div class="question-item" draggable="true">Box 4: Scotch scotch scotch</div>

和我有以下事件處理程序：

var $questionItems = $('.question-item'); 

$questionItems 
    .on('dragstart', startDrag) 
    .on('dragend', removeDropSpaces) 
    .on('dragenter', toggleDropStyles) 
    .on('dragleave', toggleDropStyles); 


function startDrag(e){ 
    console.log('dragging...'); 
    addDropSpaces(); 
    e.stopPropagation(); 
} 

function toggleDropStyles(){ 
    $(this).toggleClass('drag-over'); 
    console.log(this); 
} 


function addDropSpaces(){ 
    $questionItems.after('<div class="empty-drop-target"></div>'); 
} 

function removeDropSpaces(){ 
    console.log("dragend"); 
    $('.empty-drop-target').remove() 
}

爲什麼它僅適用於第一拖動工作。如果我拖動說最後一個可拖動 - dragend事件立即觸發。（我不想使用jQuery UI順便說一句）

它對我來說沒有意義 - 它看起來像一個錯誤。

我在OSX上的Chrome v 30上。

這裏是對的jsfiddle鏈接：http://jsfiddle.net/joergd/zGSpP/17/

（編輯：這是以下問題的重複：dragend, dragenter, and dragleave firing off immediately when I drag - 但我認爲原來的海報很好去與jQuery UI的，而我希望它是HTML5 native）

來源

2013-10-28 Joerg