Javascript 拖动：替换数据

我得到了一个包含一些html元素的网页，包括一个textarea和一个嵌入式contenteditable iframe（rte）

使用这段代码，我设法捕获主页上的draggesture事件并设置text/html数据

jQuery(document).bind('draggesture', function(event){                   
    event.originalEvent.dataTransfer.setData('text/html', 'my_data');
});

现在，当在主页上的文本区域中放置时，“my_data”将被删除。 放入contenteditable iframe也会删除“我的数据”

但我有三个问题我不明白：

1。将此类处理程序绑定到iframes文档是可行的。我将事件数据模拟设置为上述代码，但它不起作用。当我将其拖动到iframe内部或主页上的文本区域时，“my_data”不会被插入，而是原始选定内容如何设置“我的数据”？

2.我试图使用iframe和主页中的drop事件修改/设置数据：

jQuery(ed.getDoc()).bind('drop', function(event){
  event.originalEvent.dataTransfer.setData('text/html',  'my_data');
});

但我在这两个文档（主页和iframe）上都遇到了一个javascript错误：“不允许修改此文档”。 为什么会出现此错误？有解决方法吗？ 看来pimvdb得到了解释

3.当从主页选择一些文本并将其拖动到内容可编辑的iframe中时，当我使用上面的第一个代码示例设置“我的数据”（在Draggesture上）时，不会插入任何内容。拖动到文本区域可以工作有人知道这里出了什么问题吗？（使用chrome不会出现问题！）

编辑：下面是一个JSFIDLE演示，用于解决和理解问题：

---

您正在使用

draggesture

，但是

dragstart

可以工作

其次，将

数据传输

数据设置在

拖放

上是没有意义的，因为此时拖动的“包”已经到达。它在下降后被破坏了，那你为什么要在那个时候改变它呢

我清理了你的小提琴，弄清楚发生了什么，以便能够解决它，这就是结果。它似乎在铬上起作用

---

你能做一个JSFIDLE演示吗？请看我编辑的帖子-我添加了一个JSFIDLE演示+1，它在chrome中运行良好，但在firefox中不行。我需要一个firefox解决方案，因为我们的客户正在使用firefox。不幸的是，当从contenteditable iframe拖动到textarea时，使用FF5和FF6修改拖动数据不起作用。使用FF的行为还是一样的。@Thariama：我不确定Firefox。也许Firefox没有完全的支持和某些bug。拖放是HTML5，所以它可能还不能完全工作。@Thariama:恐怕我还没有找到解决办法。我会留下我的答案，但如果其他人找到了，我对解决方案很感兴趣。@Thariama:我现在也遇到了同样的问题，

此文档不允许修改

。您能说明解决方案吗？不确定，但您能确保编辑器的域和从中拖动图像的页面位于同一域吗？

tinyMCE.init({
   mode : "exact",
   elements : "content",
   skin : "o2k7",
   skin_variant : "silver",

   setup : function(ed) {
     ed.onInit.add(function(ed, evt) {
       var iframe = ed.getDoc();

       jQuery(iframe).bind('dragstart', function(event){
         event.originalEvent
              .dataTransfer
              .setData('text/plain', 'modified_content_from_iframe');
       });
     });
   },

});

jQuery(document).bind('dragstart', function(event){          event.originalEvent
         .dataTransfer
         .setData('text/html',  'my_data_html');

    event.originalEvent
         .dataTransfer
         .setData('text/plain', 'my_data_plain');
});