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

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

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

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

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

 list.ondragleave = function(e) {

 е = е || window.event;

 var to = e.relatedTarget;

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

<b>      // за границы совпадает с количеством входов, следует снять подсветку списка entered--;</b>

 if ((to && !ischild(to,list)) || entered <= 0) {

 list.className = original_class;

 entered = 0;

 }

 return false;

 }

<b>    // Этот обработчик вызывается, когда происходит сброс объекта.</b>

<b>    // Он извлекает сброшенный текст и превращает его в новый элемент &lt;li&gt;</b>

 list.ondrop = function(e) {

 е = е И window.event; // Получить объект события

 // Получить сброшенные данные в текстовом формате.

 // "Text" - это псевдоним для "text/plain".

<b>      // IE не поддерживает &quot;text/plain”, поэтому здесь используется &quot;Text&quot;.</b>

 var dt = e.dataTransfer; // объект dataTransfer

<b>      var text = dt.getData(&quot;Text&quot;); // Получить данные в текстовом формате.</b>

<b>      // Если был получен некоторый текст, превратить его в новый элемент</b>

 // списка и добавить в конец,

 if (text) {

 var item = document.createElement("li"); // Создать новый <li>

 item.draggable = true; // Сделать буксируемым

 item.appendChild(document.createTextNode(text)); // Добавить текст

 list.appendChild(item); // Добавить в список

<b>        // Восстановить первоначальный стиль списка и сбросить счетчик entered</b>

 list.className = original_class;

 entered = 0;

 return false;

 }

 };

 // Сделать все элементы списка буксируемыми

 var items = list.getElementsByTagName("li");

 for(var і = 0; і < items.length; i++) items[i].draggable = true;

<b>    // И зарегистрировать обработчики для поддержки буксировки элементов списка.</b>

<b>    // Обратите внимание, что мы поместили эти обработчики в список и ожидаем,</b>

 // что события будут всплывать вверх от элементов списка.

<b>    // Этот обработчик вызывается, когда буксировка начинается внутри списка,</b>

 list.ondragstart = function(e) {

 var е = е || window.event;

 var target = e.target || e.srcElement;

<b>      // Если всплыло событие от элемента, отличного от &lt;li&gt;, игнорировать его</b>

 if (target.tagName !== "li") return false;

 // Получить важный объект dataTransfer

 var dt = e.dataTransfer;

 // Сохранить данные и указать информацию об их формате

 dt.setData("Text", target.innerText || target.textContent);

<b>      // Сообщить, что поддерживаются операции копирования и перемещения</b>

 dt.effectAllowed = "copyMove";

 };

 // Этот обработчик вызывается после успешного сброса

 list.ondragend = function(e) {

 е = е || window.event;

 var target = e.target || e.srcElement;

<b>      // Если выполнялась операция перемещения, удалить элемент списка.</b>

<b>      // В IE8 это свойство будет иметь значение &quot;none&quot;, если явно</b>