从 iframe 移动父元素 [英] Move element within parent from iframe

问题描述

我在 index.php 中有以下代码

<img src="/images/image.jpg" id="image1" data-temp="一些有用的文本">
<div id="image_group_2">

我有一个在 Fancybox 中打开的 iframe，我希望在这个 iframe 中使用触发器将 img 元素从 image_group_1 移动到 image_group_2

现在，如果这是在主文档中触发的，那么这将是一个问题

$("#image1").appendTo("#image_group_2");

但是，由于触发器在 iframe 内，我尝试了以下操作但没有成功

var moveFrom = window.parent.$("#image1");var moveTo = window.parent.$("#image_group_2");moveFrom.appendTo(moveTo);

有关如何获得所需结果的任何建议?

解决方案

假设父窗口和 iframe 内容在同一个域，可以尝试使用 window.parent 作为上下文选择器.试试这个:

var moveFrom = $("#image1", window.parent.document);var moveTo = $("#image_group_2", window.parent.document);moveFrom.appendTo(moveTo);

如果域不同，那么您将无法使用 jQuery 或本机 JS 实现这一点.

I have the following code in index.php

<div id="image_group_1">
    <img src="/images/image.jpg" id="image1" data-temp="Some useful text">
</div>
<div id="image_group_2">
</div>

I have an iframe that opens in Fancybox and I am looking to use a trigger within this iframe to move the img element from image_group_1 to image_group_2

Now, if this were being triggered within the main document then this would be a matter of

$("#image1").appendTo("#image_group_2");

However, as the trigger is within the iframe, I have tried the following without success

var moveFrom = window.parent.$("#image1");
var moveTo = window.parent.$("#image_group_2");
moveFrom.appendTo(moveTo);

Any suggestions as to how to get the desired result?

解决方案

Assuming both the parent window and iframe content are on the same domain, you can try using the window.parent as a context selector. Try this:

var moveFrom = $("#image1", window.parent.document);
var moveTo = $("#image_group_2", window.parent.document);
moveFrom.appendTo(moveTo);

If the domains are different, then you will not be able to achieve this, using either jQuery or native JS.

这篇关于从 iframe 移动父元素的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！