HTML5 CREAFT EFFECTINGED и Dropeffect ⇐ Jquery

[Anonymous]

Отношения между этими двумя свойствами, похоже, стали источником некоторой путаницы. Прочитав сайт MDN и MSDN, я думал, что понял это, но теперь я не уверен...
Я решил, что при перетаскивании элемента вы можете указать, что с ним может произойти (т. е. его можно перемещать, копировать, связывать с ним — одна из констант effectAllowed). Это свойство effectAllowed.
Различные цели перетаскивания выполняют разные действия, поэтому при перетаскивании на другой элемент можно контролировать, какой «эффект» произойдет при перетаскивании. свойство dropEffect. Поэтому я привел простой пример для проверки этой теории:
JSFiddle

Код: Выделить всё

$("[draggable='true']").on("dragstart", function(e) {
var dt =  e.originalEvent.dataTransfer;
dt.effectAllowed = "copyMove";
dt.setData("text/plain", "Foo");
});

$("#dropZoneCopy").on("dragover", function(e) {
var dt =  e.originalEvent.dataTransfer;
dt.dropEffect = "copy";
e.preventDefault();
});

$("#dropZoneMove").on("dragover", function(e) {
var dt =  e.originalEvent.dataTransfer;
dt.dropEffect = "move";
e.preventDefault();
});

У меня есть ящик, которую пользователь может перетаскивать - разрешенные эффекты - это Copymove . У меня есть одно поле, которое устанавливает Dropeffect для копирования, и после того, как он устанавливает Dropeffect для перемещения. Что я ожидаю, так это то, что когда пользователь перетаскивает ящик «копирование», курсор изменится, чтобы указать, что копия произойдет, когда я перетаскиваю на поле «Перемещение», курсор изменяется, чтобы указать движение ...
< Br /> только Chrome ведет себя так, как я и ожидал. Это потому, что другие браузеры ошибаются или потому что я не понимаю спецификации. должным образом? Если у вас есть источник перетаскивания, который указывает на то, что EffectAllowed - Copy и зона выброса, в которой говорится, что dropeffect - это перемещение , то вы не можете оставить в зоне выброса, даже если вы отмените событие. Я думал, что dropeffect был бы полезен для чтения Ondrop, чтобы увидеть, что делать, но он не доступен на Chrome, Dropeffect не отображается на обработке Drop, например, Попытка прочитать datatransfer.dropeffect скажет, что dropeffect не является , даже если вы устанавливаете его на драгвер. Настройка Dropeffect , как отмечалось выше, влияет на то, как отображается курсор. , но это не влияет на отображение курсора мыши. На Firefox в Windows нажатие клавиши ctrl влияет на отображение мыши, но не влияет на свойство dropeffect . Источник может прослушать событие Dragend, чтобы увидеть, что произошло. Он должен посмотреть на Dropeffect в этом событии. Chrome, Mozilla и Safari работают, как вы надеетесь здесь, эффект падения появляется на мероприятии Dragend. IE, если разрешенный эффект является простым значением, например, «Копировать» тогда любое успешное снижение приводит к тому, что это значение появляется как Dropeffect на Dragend. Если EffectAllowed был составным значением, таким как CopyMove, и вы попытались выбрать «Move» на Dragever, установив Dropeffect, вам не повезло, это будет проходить как dropeffect = "none" в источнике на Dragend. Вы застряли с одним курсором и одним Dropeffect, и это эффектный набор на Dragstart, если этот эффект является простым значением. Интересно, что Dropeffect, кажется, происходит, когда вы перетаскиваете нативное приложение, по крайней мере, из IE11 (и я предполагаю ранее). < /P>
Другие примечания < /p>
На Safari на Mac - EffectAllowed не может быть установлен программатически, поэтому любая установленная Dropeffect является действительным. Когда вы нажимаете клавишу CMD, EffectAllowed становится «перемещением», и когда вы нажимаете клавишу ALT, эффект спускается «копирование». После этого это работает, как вы надеетесь, если Dropeffect не является одним из этих эффектов, падение не разрешено браузером. < /P>
больше информации < /strong>
Я проводил немного свободного времени, работая в библиотеке Drag and Drop HTML5, я написал больше об этом и других вопросах в документах, если вам интересно, посмотрите на
Проект < / п>

Подробнее здесь: https://stackoverflow.com/questions/204 ... dropeffect