К сожалению, у меня нет устройства с iOS12 (мое устройство не поддерживает его), и я не могу его протестировать. И я не знаю, почему поддержка iOS / Apple пишет, что они поддерживают это событие в iOS 11.2 и на вашем новом устройстве это не поддерживается.
Альтернативное решение
С помощью этого обходного пути вы получите решение для всех современных устройств и браузеров. Это лучше, чем ждать поддержки от iOS / Apple.
События
dragstart
, dragover
, dragleave
, drop
не работают на всех сенсорных устройствах.
Вы должны использовать соответствующие имена событий для сенсорных событий, например:
touchstart
touchend
touchcancel
touchmove
Чтение документации об этих событиях.
Чтобы обеспечить качественную поддержку сенсорных пользовательских интерфейсов, сенсорные события предоставляют возможность интерпретировать действия пальцев (или стилуса) на сенсорных экранах или трекпадах.
Интерфейсы сенсорных событий - это API-интерфейсы относительно низкого уровня, которые можно использовать для поддержки специфических для приложений взаимодействий с несколькими касаниями, таких как жест двумя пальцами. Взаимодействие с несколькими касаниями начинается, когда палец (или стилус) впервые касается поверхности контакта. Другие пальцы могут впоследствии касаться поверхности и, необязательно, перемещаться по поверхности касания. Взаимодействие заканчивается, когда пальцы удалены с поверхности. Во время этого взаимодействия приложение получает сенсорные события во время фазы запуска, перемещения и завершения.
События касания аналогичны событиям мыши, за исключением того, что они поддерживают одновременные касания и находятся в разных местах сенсорной поверхности. Интерфейс TouchEvent инкапсулирует все активные точки касания. Сенсорный интерфейс, представляющий одну точку касания, содержит такую информацию, как положение точки касания относительно окна просмотра браузера.
К сожалению, события touchenter
и touchleave
были удалены из спецификации, и из-за этого, если вам это нужно, вы должны написать обходной путь, используя document.elementFromPoint()
, например:
document.addEventListener('touchmove', function(e)
{
var touch = e.touches[0],
elementFromPoint = document.elementFromPoint(touch.pageX - window.pageXOffset, touch.pageY - window.pageYOffset);
if(elem == elementFromPoint) //elem is your element which was entered
{
//your code for touchenter event
}
else //the code for touchleave event
});
Возможно, для некоторых других мобильных устройств и их браузеров вам потребуется использовать полифилы ( 1 , 2 ), которые поддерживают HTML5 поддержка перетаскивания на мобильных (сенсорных) устройствах.