如何准确地在iframe中实现拖放功能？

Question

我能够修改iframe的主体内容，并将输入元素放置到iframe中页面上特定位置的主体上，现在我想为其添加拖放功能，以便用户可以拖动输入元素并放置它在iframe上的任何地方都可以是空白，也可以在任何文本或图片上​​。

我也可以做到，但收效甚微

我尝试了几件事

首先，我使用html5拖放功能执行此操作，但它会在捕获元素时根据捕获的事件删除可拖动div元素。 即我用event.clientX，event.clientY＆position：absolute设置div元素的左和顶部位置。

类似这样的东西：-

 function drop(target, event) {
             var id = event.dataTransfer.getData('Text');       
             if (!id) return;
             var e = document.getElementById(id);
             e.style.position = "absolute";
             e.style.left = (event.clientX+offsetx)+"px";
             e.style.top = (event.clientY+offsety)+"px";        
             event.preventDefault();
         }

我想做的是根据我拖动该元素的屏幕坐标设置div元素，而不是根据拖放时捕获的事件进行设置。在放下时，它给出了捕获的事件的坐标，而不是真实的屏幕坐标。

第二次在iframe主体中附加可拖动元素，并将位置设置为绝对，然后div元素管理位置。