2016-03-30 9 views
0

У меня возникла проблема, когда у меня есть поле с большим текстом, в котором есть режим разработки, который находится в пределах сортируемого LI. Проблема заключается в том, что designMode изменяется на «Off», если LI перетаскивается в новую позицию. И хотя я могу настроить правильный iframe, он, кажется, игнорирует, когда я говорю, чтобы он снова включил designMode, кто-нибудь знает, почему это происходит? Спасибо за чтение.Содержимое iframe, редактируемое, которое находится в элементе сортируемого списка jqueryUI

редактировать: jfiddle пример: https://jsfiddle.net/LcLfaa8j/2/

function getRichTextField(itemId) { 
    console.log('get rich text field'); 
    return document.getElementById('rtf-iframe-' + itemId); 

}

$ (документ) .ready (функция() {

getRichTextField("sort-textItem-1").contentWindow.document.designMode = "On"; 

getRichTextField("sort-textItem-2").contentWindow.document.designMode = "On"; 

$("#text-areas").sortable({ 
    axis: 'y', 
    opacity: 0.8, 
    tollerence: 'pointer', 
    update: function(event, ui) { 
     var order = $(this).sortable("serialize", { key: "order" }); 
     console.log("New Order = " + order); 

     console.log('the iframe that was moved designMode is now Off...'); 

     var richText = getRichTextField($(this).data().uiSortable.currentItem.attr('id')); 

     console.log('TEST: the current is ' + $(this).data().uiSortable.currentItem.attr('id') + ' and designMode = ' + richText.contentWindow.document.designMode + ' doubleCheckOfRTFid = ' + $(richText).attr('id') + ' class = ' + $(richText).attr('class')); 

     richText.contentWindow.document.designMode = "On"; 

     console.log('just attempted to turn designMode back on... but it gets ignored'); 
    } 
    }); 

});

+0

Я могу с уверенностью сказать, что никто не знает, что происходит. Вы не можете получить полезные, конкретные ответы на неопределенные вопросы. Вам нужно включить примеры, которые показывают проблему; никто не придет и не сделает для вас всю работу. – LinuxDisciple

+0

ценим головы, работая на примере в данный момент, чтобы опубликовать. – RON2015

+0

https://jsfiddle.net/LcLfaa8j/2/ Я создал небольшой пример, в котором есть два iframe с designMode on, LI, в котором они находятся, сортируются, попробуйте повторно отсортировать их и обратите внимание, что designMode только один вы щелкнули, чтобы перетащить его в новое положение, так как он отключен, и моя попытка вернуть его обратно не удалась. – RON2015

ответ

0

Кажется, что добавьте небольшую задержку с помощью setTimeout перед тем, как включить designMode в исправление. Это единственное решение? Просто любопытно.

1

Это лишь частичный ответ.
DesignMode не отключается; он отключен по умолчанию, и документ, в который вы устанавливаете .designMode="on", удаляется (а затем воссоздается с нуля) при его перетаскивании. Вы можете видеть, что если вы помещаете контент в один из документов, а затем перетаскиваете его, содержимое исчезает. Похоже, что iframe получает новое .contentWindow, что означает, что у него есть другой дочерний документ.
Вы можете увидеть это в инспекторе, запустив

var before = getRichTextField("sort-textItem-2"); 
var beforecontentWindow=before.contentWindow; 

(Теперь перетащите второй IFRAME)
Теперь запустите:

var after = getRichTextField("sort-textItem-2"); 
var aftercontentWindow=after.contentWindow; 

Теперь сравните ссылки с ===:

before === after ;//returns true because iframe is the same 
beforecontentWindow === aftercontentWindow ;//returns false because .contentWindow changed 

Также см. Это сообщение Jquery Sortable and Draggable between parent and child frame, где ему не удалось выполнить перетаскивание gable и sortable, но в конечном итоге он работает. Я не знаю, почему перетаскивание даст вашему iframe новый contentWindow, но, возможно, кто-то еще сможет это сделать.