Подтвердить что ты не робот

Обнаружение поддержки HTML5 Drag And Drop в javascript

Я пытаюсь обнаружить поддержку HTML5 Drag And Drop в JavaScript. Modernizr, похоже, не справляется с этим тестовым случаем.

4b9b3361

ОТВЕТЫ

Ответ 1

Вы можете сделать это:

if('draggable' in document.createElement('span')) {
  alert("Drag support detected");
}

Вы можете увидеть быстрый демонстрационный тест, используя вышеуказанную проверку здесь.

Кроме того, есть замечательная функция обнаружения (не браузер, yay!) список, который довольно хорошо поддерживается здесь в случае, если вы ищете другие функции HTML5.

Ответ 2

Обнаружение "draggable" в document.createElement( "span" ) кажется хорошей идеей, но на практике это не работает.

iOS утверждает, что draggable находится в элементе, но не позволяет перетаскивать. (Ссылка: Руководство по веб-контенту Safari: обработка событий)

IE9 утверждает, что draggable НЕ находится в элементе, но позволяет перетаскивать. (Ссылка: мое тестирование HTML5 перетаскивается в IE.)

Modernizr - лучший выбор, потому что он не путает IE. Однако он утверждает, что перетаскивание HTML5 доступно на iOS.

Вот как я обнаруживаю перетаскивание HTML5:

var iOS = !!navigator.userAgent.match('iPhone OS') || !!navigator.userAgent.match('iPad');
if (Modernizr.draganddrop && !iOS) {
    HTML5 drag and drop solution
} else if (Modernizr.draganddrop && iOS) {
    iOS drag and drop solution 
} else {
    non-HTML5 drag and drop solution
}

Ответ 3

Вот как это реализовано в Modernizr

function() {
    var div = document.createElement('div');
    return ('draggable' in div) || ('ondragstart' in div && 'ondrop' in div);
}