我正在尝试使用 jQuery 在父框架和 iframe 之间拖放元素。我在父框架中有一个面板,其中包含一些可拖放到子框架上的可拖动项目。我试图搜索很多,但找不到很多...
我试图通过在子框架内附加元素然后尝试以编程方式在新插入的元素上触发可拖动来解决它,但我也被困在那里。找不到触发拖动功能的正确方法。(可拖动元素有一个助手。当我通过触发“mousedown.draggable”触发拖动时,ui-draggable 元素上的位置会发生变化,但我看不到助手。
谢谢!!
我正在尝试使用 jQuery 在父框架和 iframe 之间拖放元素。我在父框架中有一个面板,其中包含一些可拖放到子框架上的可拖动项目。我试图搜索很多,但找不到很多...
我试图通过在子框架内附加元素然后尝试以编程方式在新插入的元素上触发可拖动来解决它,但我也被困在那里。找不到触发拖动功能的正确方法。(可拖动元素有一个助手。当我通过触发“mousedown.draggable”触发拖动时,ui-draggable 元素上的位置会发生变化,但我看不到助手。
谢谢!!
使用 HTML5 拖放 API 创建跨框架和跨浏览器实现。 http://blog.stackhive.com/post/137799349684/building-a-seamless-drag-and-drop-interface
编辑 - 上一个链接无效(dockPHP 更名为 StackHive),因此写了一篇更完整的帖子,可以帮助创建史诗般的拖放界面。
AFAIK,如果 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/
不管框架的结构如何,总是可以使用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);