HTML 5 события перетаскивания
Я пытаюсь создать переупорядочиваемый список в JS и HTML. (пытаясь сделать это без использования jQuery ui) Я не могу понять, почему только события dragstart и dragend запускаются при перетаскивании элемента списка. Кто-нибудь знает, почему другие события не стреляют?
<ul>
<li draggable="true" class="drag">1111111</li>
<li draggable="true" class="drag">222222</li>
<li draggable="true" class="drag">333333</li>
<li draggable="true" class="drag">444444</li>
</ul>
<script type="text/javascript">
var drags = document.querySelectorAll('.drag');
[].forEach.call(drags, function(drag) {
drag.addEventListener('dragstart', handleDragStart, false);
drag.addEventListener('dragenter', handleDragEnter, false);
drag.addEventListener('dragover', handleDragOver, false);
drag.addEventListener('dragleave', handleDragLeave, false);
drag.addEventListener('dragend', handleDragEnd, false);
});
function handleDragStart(e){
console.log('handleDragStart');
}
function handleDragEnter(e){
console.log('handleDragEnter');
}
function handleDragOver(e){
console.log('handleDragOver');
}
function handleDragLeave(e){
console.log('handleDragLeave');
}
function handleDragEnd(e){
console.log('handleDragEnd');
}
</script>