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

Question

我正在尝试使用jQuery在父框架和 iframe 之间拖放元素。

我有一个面板在父框架中，其中包含一些可拖动的项目，可以将它们放在子帧中。我试图搜索很多但没找到太多资料...

我尝试通过将元素附加到子框架中，然后尝试在新插入的元素上以编程方式触发可拖动，但我也被卡住了。找不到正确的方法来触发拖动函数。（可拖动元素具有一个辅助程序。当我通过触发 "mousedown.draggable" 来触发拖动时，ui-draggable 元素上的位置会改变，但我看不到辅助程序。

谢谢!!

- Kshitiz

Answer 1

据我所知，如果iframe来自不同的域，这在“常规”方式下是不可行的（除非您控制两个iframe），浏览器安全措施会防止它，否则您可以包装一个银行网站并窃取密码，例如，在您登录时。

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

如果您控制两个iframe：

通过示例在iframe之间拖放：http://www.dhtmlx.com/docs/products/dhtmlxTree/samples/05_drag_n_drop/06_pro_drag_frame.html

跨浏览器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/

- Marcos Besteiro López

---

嘿，非常感谢。我暂时放弃了拖放功能，但是根据我阅读的链接，这正是我正在寻找的（是的，我可以控制两个框架）。 - Kshitiz

嘿，我已经想出了如何仅使用jQuery来完成这个任务...拖放和ConnectToSortable...一旦我完善它，我会发布我的答案... - Kshitiz

Answer 2

无论框架的结构如何，我们总是可以使用Robot类在它们之间拖放元素。以下是一个示例代码：

//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);

- Satya