У меня есть список списков участников для функции перетаскивания.
td.addEventListener('dragenter', onDragEnter);
td.addEventListener('dragleave', onDragLeave);
td.addEventListener('dragover', onDragOver);
td.addEventListener('drop', onDrop);
В Firefox событие drop не вызывается, когда предмет выпадает.Функции, вызываемые для dragenter, dragover и dragleave, предотвращают действие по умолчанию (скопировано из http://mereskin.github.io/dnd/):
const onDragEnter = e => {
onDragOver(e);
console.log('onDragEnter:');
if(e.target.nodeType == 1) {
e.target.className = 'drop-over';
} };
const onDragOver = e => {
console.log('onDragOver:');
if(e.target.nodeType == 1) {
e.dataTransfer.dropEffect = e.target.getAttribute('data-drop-effect');
e.preventDefault();
e.stopPropagation();
} };
Вкл. http://mereskin.github.io/dnd/ все события, кажется, работают (пыталисьте же методы, списки событий и т. д.) Перетаскиваемый элемент создается с определенным атрибутом:
let img = document.createElement('img');
img.src = `icons/${obj._image}`;
img.setAttribute('draggable','true');
В Chrome он отлично работает, на моем веб-сайте и на связанном веб-сайте.
Редактировать: Tried Edgeтакже работает нормально. Пробовал также FF на другой машине, тот же результат. Создал jsfiddle для демо: https://jsfiddle.net/as965dkz/6/