Question

我正在创建一个弹出窗口，我想在弹出窗口中显示Div的内容。如何复制Background WIndow的内容并使它们附加到弹出窗口。因为我想在弹出窗口中显示后端面板的相同预览。如何做。

是的，我的背景小组是

 <div id="fb_contentarea_down21">
      <div id="field1">
         <input id="input1"></input>
      </div>
      <div id="field2">
        <textarea id="input2"></textarea>
      </div>
 </div>

我想在预览窗口中显示这些内容（背景）如何操作。以下是弹出窗口..

   <div id="popupContact" style="position: absolute; top: 208px; left: 436px; display: none;">
    <a id="popupContactClose">x</a>
    <h1>Title of our cool popup, yay!</h1>
    <p id="contactArea">

    </p>
</div>

如何在ContactArea ...

中显示fb_contentarea_down21的内容

Answer 1

您可以克隆片段并将其附加到弹出窗口中。

$('#fb_contentarea_down21').clone().appendTo('#contactArea');

唯一的问题是你最终会在dom中找到无效的idlciate id，并且会开始对你的选择器造成严重破坏。所以你必须重命名所有可能变得混乱的id

最好的办法是附加片段，当你关闭弹出窗口时，将片段追加回

 $('#fb_contentarea_down21').children().appendTo('#contactArea');

然后关闭弹出窗口

 $('#contactArea').children().appendTo('#fb_contentarea_down21');

Answer 2

仅显示输入内的文本，而不是输入的克隆：

$('#contactArea').text(
    $('#fb_contentarea_down21 input').val() +
    $('#fb_contentarea_down21 textarea').val()
)

Answer 3

我认为你想要克隆功能。将项目克隆到弹出窗口

$("#fb_contentarea_down21").clone().appendTo($("#ContactArea"));

* .clone（）函数也可以接收bool参数所以如果你克隆一个有事件的项目（比如一个带有点击事件的按钮）传递真实也将包括该事件。

在redsquare评论后编辑

执行克隆后，您需要替换新创建的项目的所有ID。因为克隆会导致多个元素具有相同的ID。

另一个可能性是在弹出窗口中打开iframe并使用克隆或.load（）将项目复制到弹出窗口中。

复制div的内容并使用JQuery将其粘贴到Preview窗口

3 个答案: