拖动时保留IFRAME内容

在我目前的项目中，我正在一些TEXTAREA's上实现jHtmlArea WYSIWYG插件，这些插件是可拖动和可排序的行。 唯一的问题是，一旦你开始拖动它们，它们就会丢失插件掩盖相关TEXTAREA的IFRAME中的所有数据。 jQuery的.clonefunction正在被使用，但它本身并没有随身携带所有数据，甚至将它设置为.clone(true)或.clone(true, true)也不会保留拖拽数据。 例：

http://jsfiddle.net/5QL7W/1/

有没有办法保留内容？

Answer 1

我想我终于弄明白了：

http://jsfiddle.net/5QL7W/27/

在我意识到拖拽上似乎消失的内容没有完全消失但存储在某个地方（我不知道的地方）并且在页面重新加载/刷新之后会出现在富文本编辑器的IFRAME中之后，答案慢慢来了。在jsfiddle中无法轻易说明的东西，其中重新加载页面从头开始谁的事情）。 一旦我终于意识到，那么我使用了jHtmlArea插件的“dispose”function（我认为它们应该可以命​​名为“destroy”），然后立即重新初始化插件，然后数据将重新出现。 由于我无法弄清楚如何识别DOM中拖动克隆的行（或至少如何创建它的jQuery对象），我做了处理并重新初始化所有TEXTAREA然后找到当我使用.each（）方法定位每一个时，它效果最好，或者有时其中一些不会被处理然后重新初始化（参见前面提到的http://jsfiddle.net/5QL7W/24/作为示例）。

相关代码：

 var fixHelperModified = function (e, tr) { var $originals = tr.children(); var $helper = tr.clone(); $helper.children().each(function (index) { $(this).width($originals.eq(index).width()) }); return $helper; }, updateIndex = function (e, ui) { $('td.index', ui.item.parent()).each(function (i) { $(this).html(i + 1); }); $('#sort TBODY TEXTAREA').each(function () { $(this).htmlarea('dispose'); $(this).htmlarea({ toolbar: ["bold"] }); }); }; $("#sort TBODY").sortable({ helper: fixHelperModified, stop: updateIndex });