Изучаем HTML 5-Б. Лоусон, Р. Шарп - 2011 |
Страница 209 из 244 11 делаем что-нибудь с dataTranf er. setData }; boxes[i].ondragend = function () { this.setAttribute('aria-grabbed' 'false'); // сброс зон приема drop.tablndex = -1; // для поддержки клавиатуры drop.removeAttribute('aria-dropeffeet'); }; boxes[i].tablndex = 0; // для поддержки -i клавиатуры boxes[i].setAttribute('aria-grabbed' -i 'false'); } } В этом коде производится поиск элементов div, для которых установлен атрибут draggable. Затем, начиная с события dragstart, добавляется поддержка ARIA. Как только пользователь начинает перетаскивать элемент, атрибуту aria-grabbed присваивается значение true, чтобы вспомогательное устройство могло сообщать приложению свои сведения. Помимо этого, зона приема превращается в элемент, на который может переводиться фокус клавиатуры. Для этого используется tablndex = 0# Наконец, мы говорим, что когда пользователь «отпускает» элемент, должно производиться копирование. Воспроизвести allowedEf fect и dropEf fect можно и в родных приложениях с поддержкой drag and drop, но пока что мы сосредоточимся на поддержке ARIA. Затем мы добавляем новый обработчик события dr agend,а когда перетаскивание элемента прекращается, удаляем атрибут aria-grabbedи сбрасываем атрибуты зоны приема, то есть tablndex и dropEf feet в конце мы инициализируем перетаскиваемый элемент, устанавливая атрибут tablndexи флаг захвата. Благодаря этому коду пользователи могут перемещаться по приложению и его компонентам, поддерживающим перетаскивание. Устройства считывания экрана (если они поддерживают ARIA) будут сообщать приложению текущее состояние операции. Однако — и это очень значимое однако — так как ни в одном браузере клавиатурная поддержка перетаскивания пока не реализована, вероятно, вам придется создавать с помощью |