Перетащите событие в элемент contentEditable - PullRequest
Новая
       25

Перетащите событие в элемент contentEditable

3 голосов
/ 02 сентября 2011

Какое событие вызывается, когда кто-то отбрасывает что-то в элемент contentEditable (после перетаскивания)?

Я говорю о простом старом перетаскивании, а не перетаскивании HTML5 (где любой элемент можно сделать перетаскиваемым).);случай использования просто:

  • на странице есть div contentEditable, используемый в качестве редактора
  • пользователь перетаскивает некоторый HTML-код с текущей страницы или с другой страницы, илииз окна другого браузера (так что на самом деле не существует понятия «исходный» объект: источник может исходить из-за пределов браузера)
  • Мне нужно уведомить, что контент был перенесен в div contentEditable, поэтомучто я могу действовать (очистить его)

Я мог бы опросить div, чтобы выяснить, есть ли что-нибудь там, что не чисто, но дорого и "некрасиво";конечно, есть событие, которое срабатывает, когда происходит падение ...?

1 Ответ

7 голосов
/ 02 сентября 2011

Я столкнулся с той же проблемой, когда писал плагин tinyMCE.Я нашел лучший способ отследить перетаскивание элементов в зоне contentEditable - прослушать событие «DOMNodeInserted» в элементе contentEditable.

Обратите внимание, что этот элемент запускается элементом contentEditable при удалениивыполняется так, чтобы его целевое свойство было установлено на этот элемент.Вы можете извлечь перемещенный элемент, проверив свойство event.originalEvent.target.

Имейте в виду, что это событие вызывается после завершения удаления и вставки элемента удаления. 

$('#editor').bind('DOMNodeInserted', function(event){
      if(event.originalEvent && event.originalEvent.target){
        var target = $(event.originalEvent.target);
        //now you can check what has been moved
      }
});
...