Перетаскивание в html5, очищается форма
Здравствуйте,
все перетаскивается, и исправно работает, но стоит изменить содержимое поля и перетащить его, как оно отчищается. Помогите пожалуйста изменить скрипт, так, чтобы изменения сохранялись. <ul id="file_list"> <li draggable="true"> <textarea name="text">текст...</textarea> </li> <li draggable="true"> <textarea name="text"></textarea> </li> </ul> Пример вызова: var fileList = $('#file_list'); var drop = new Draggable(fileList.find('li')); fileList.find('li').each(function() { drop.handleAdd(this); }); function Draggable(cols) { var dragSrcEl; this.handleDragStart = function(e) { this.style.opacity = '0.9'; e.dataTransfer.effectAllowed = 'move'; e.dataTransfer.setData('text/html', this.innerHTML); dragSrcEl = this; this.classList.add('moving'); } this.handleDragOver = function(e) { if (e.preventDefault) { e.preventDefault(); } e.dataTransfer.dropEffect = 'move'; return false; } this.handleDragEnter = function(e) { this.classList.add('over'); } this.handleDragLeave = function(e) { this.classList.remove('over'); } this.handleDrop = function(e) { if (e.stopPropagation) { e.stopPropagation(); } if (dragSrcEl != this) { dragSrcEl.innerHTML = this.innerHTML; this.innerHTML = e.dataTransfer.getData('text/html'); } return false; } this.handleDragEnd = function(e) { this.style.opacity = '1'; [].forEach.call(cols, function(col) { col.classList.remove('over'); col.classList.remove('moving'); }); } this.handleAdd = function(col) { col.setAttribute('draggable', 'true'); col.addEventListener('dragstart', this.handleDragStart, false); col.addEventListener('dragenter', this.handleDragEnter, false); col.addEventListener('dragover', this.handleDragOver, false); col.addEventListener('dragleave', this.handleDragLeave, false); col.addEventListener('drop', this.handleDrop, false); col.addEventListener('dragend', this.handleDragEnd, false); } } |
Zhazhah,
Перетаскивать нун не HTML формы - а сам объект, ибо в HTML нет записанных полей ввода, они в объекте, либо перед перетаскиванием явно парсить объект вынимая значения полей и явно вписывая их вHTML формы, добавляя строки к value (не Айс метод, но как то делал для передачи текстовой строкой во фрейм на ином домене) |
Подключил Jquery плагин, он лучше в этом плане.
|
Часовой пояс GMT +3, время: 23:57. |