JavaScript. Подробное руководство, 6-е издание

Флэнаган Дэвид

for(var і = 0; і < lists.length; i++)

if (regexp.test(lists[i].className)) dnd(lists[i]);

// Добавляет обработчики событий буксировки в элемент списка

function dnd(list) {

var original_class = list.className; // Сохранить начальный CSS-class

var entered =0; //

Вход и выход за границы

// Этот обработчик вызывается, когда буксируемый объект оказывается над списком.

// Он проверяет, содержит ли буксируемый объект данные в поддерживаемом формате.

// и, если это так, отменяет событие, чтобы сообщить, что список готов

// принять объект. В этом случае он также подсвечивает элемент-приемник,

// чтобы показать пользователю, что готов к приему данных,

list.ondragenter = function(e) {

е = е И window.event; // Объект события, стандартный или IE

var from = е.relatedTarget;

// События dragenter и dragleave всплывают, из-за чего сложнее определить,

// когда следует подсвечивать элемент, а когда снимать подсветку в случаях,

// подобных этому, где элемент <ui> содержит дочерние элементы <li>.

// В броузерах, поддерживающих свойство relatedTarget, эту проблему можно решить.

// В других броузерах приходится считать пары событий входа/выхода.

// Если указатель мыши оказался над списком, переместившись из-за его пределов,

// или он оказался над списком впервые, необходимо выполнить некоторые операции

entered++;

if ((from && !ischild(from, list)) || entered == 1) {

// Вся информация о буксируемом объекте находится в объекте dataTransfer

var dt = е.dataTransfer;

// Объект dt.types содержит список типов, или форматов, в которых доступны

// буксируемые данные. Спецификация HTML5 требует, чтобы свойство types имело

// метод contains. В некоторых броузерах это свойство является массивом

//

с методом indexOf. В IE версии 8 и ниже оно просто отсутствует,

var types = dt.types; // В каких форматах доступны данные

// Если информация о типах отсутствует или данные доступны в простом

// текстовом формате, подсветить список, чтобы показать пользователю, что он

// готов принять данные, и вернуть false, чтобы известить о том же и броузер,

if (!types || //IE

(types.contains && types.contains("text/plain")) || //HTML5

(types.indexOf && types.indexOf("text/plain")!=-1)) //Webkit

{

list.className = original_class + " droppable";

return false;

}

// Если тип данных не поддерживается, мы не сможем принять их return;

// без отмены

}

return false; // Если это не первое вхождение, мы по-прежнему готовы

};

// Этот обработчик вызывается в ходе буксировки объекта над списком.

// Этот обработчик должен быть определен, и он должен возвращать false,

// иначе сброс объектов будет невозможен,

list.ondragover = function(e) { return false; };

// Этот обработчик вызывается, когда буксируемый объект выходит за границы списка

// или за границы одного из его дочерних элементов. Если объект действительно

// покидает границы списка (а не границы одного из его элементов),

// то нужно снять подсветку списка,

list.ondragleave = function(e) {

е = е || window.event;

var to = e.relatedTarget;

// Если буксируемый объект покидает границы списка или если количество выходов