मैं कई खींचने योग्य तत्वोंएचटीएमएल 5 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()
}
क्यों यह केवल पहला खींचने योग्य के लिए काम करता है। यदि मैं खींचता हूं कि आखिरी ड्रैगगेबल - ड्रैगएंड इवेंट तुरंत निकाल दिया जाता है। (मैं btw jQuery UI का उपयोग नहीं करना चाहते हैं)
यह मेरे लिए कोई मतलब नहीं है - यह एक बग की तरह दिखता है।
मैं क्रोम वी 30 पर OSX पर कर रहा हूँ।
यहाँ JSFiddle के लिए एक लिंक है: http://jsfiddle.net/joergd/zGSpP/17/
(संपादित करें: इस निम्नलिखित प्रश्न को बार-बार होता है: dragend, dragenter, and dragleave firing off immediately when I drag - लेकिन मुझे लगता है कि मूल रूप से पोस्ट jQuery UI के साथ जाने के लिए ठीक था, जबकि मैं इसे होना चाहता हूँ एचटीएमएल 5 मूल)