在父框架和子框架iframe之间拖放元素

Question

我正在尝试使用jQuery在父框架和iframe之间拖放元素。 我在父框架中有一个面板，其中包含一些可以拖放到子框架上的可拖动项目。我试图搜索很多，但找不到多少......

我尝试通过在子框架中附加元素然后尝试以编程方式触发新插入元素上的draggable来解决它，但我也被卡在那里。找不到触发拖动功能的正确方法。 （draggable元素有一个帮助器。当我通过触发“mousedown.draggable”触发拖动时，ui-draggable元素上的位置发生了变化，但是我看不到帮助器。

谢谢！

Answer 1

使用HTML5拖放API创建跨框架和跨浏览器实施。 http://blog.stackhive.com/post/137799349684/building-a-seamless-drag-and-drop-interface

编辑 - 前一个链接无效（dockPHP被重新命名为StackHive）所以写了一篇更完整的文章，可以帮助创建一个史诗般的拖放界面。

Answer 2

AFAIK，如果iframe来自不同的域，这是不可行的“通用”方式（除非你控制两个iframe），浏览器安全措施阻止它，否则你可以包装银行网站并窃取密码，例如，当你登录时。

有关解决方法的一些信息：http://softwareas.com/cross-domain-communication-with-iframes

如果你控制两个iframe：

拖动＆amp;通过示例：http://www.dhtmlx.com/docs/products/dhtmlxTree/samples/05_drag_n_drop/06_pro_drag_frame.html

在iframe之间删除

跨浏览器HTML5拖放：http://www.useragentman.com/blog/2010/01/10/cross-browser-html5-drag-and-drop/

另一个示例：http://jqfaq.com/how-to-implement-drag-and-drop-between-iframes/

Answer 3

不管框架的结构如何，都可以始终使用Robot class在框架上拖放元素。我提供了一个示例代码，以防万一：

//Setting up chrome driver
WebDriverManager.getInstance(CHROME).setup();
WebDriver driver = new ChromeDriver();
driver.manage().window().maximize();

//Redirecting to the website
driver.get("https://codepen.io/rjsmer/full/vvewWp");

Robot robot = new Robot();
robot.mouseMove(x-coordinate1, y-coordinate1);
robot.mousePress(InputEvent.BUTTON1_DOWN_MASK);

Thread.sleep(2000);
robot.mouseMove(x-coordinate2, y-coordinate2);

Thread.sleep(2000);
robot.mouseRelease(InputEvent.BUTTON1_DOWN_MASK);