Question

我有一个网页，其中包含一些html元素，包括textarea和嵌入式conrameteditable iframe（rte）。

使用此代码我设法捕获主页面上的draggesture事件并设置text / html-data

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

现在，当放入主页上的textarea时，“my_data”会被删除。放入令人满意的iframe也会丢掉'my_data'。

但是我在这里遇到了三个我不明白的问题：

1。将此类处理程序绑定到iframes文档有效。我将事件数据设置为与上面的代码类似，但它不起作用。当我将它拖到iframe内或主页上的textarea时，'my_data'不会插入，而是原始选中的内容。 如何设置'my_data'？

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

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

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

3。当从主页面选择<p>some text</p><hr><p>some text</p>并将其拖入可信任的iframe时，当我使用上面的第一个代码示例设置'my_data'（在Draggesture上）时，不会插入任何内容。拖入textarea工作。 有谁知道这里出了什么问题？（使用chrome不会出现问题！）

编辑：这是一个jsFiddle演示，可以解决问题：

http://jsfiddle.net/R2rHn/5/

Answer 1

您正在使用draggesture，但dragstart可以使用。

其次，在dataTransfer上设置drop数据没有意义，因为拖动“包”已经到了。在跌落之后它会被摧毁，所以你为什么要在那个时候改变它呢？

我清理了你的小提琴，直接发生了事情，以便能够解决它，这就是结果。它似乎适用于Chrome。

http://jsfiddle.net/R2rHn/7/

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');
});

拖动：替换数据

1 个答案: