Question

尝试在同一页面内的页面加载上执行此操作：

CSS：

#item1, #item2, #item3 {visibility: hidden;}

HTML（这些不会显示）

<div id="item1">Something1</div> 
<div id="item2">Something2</div>
<div id="item3">Something3</div>

这些div通常是空的，但在页面加载后，它们将根据上面div的内容进行填充。

<div id="real-content">
    <div id="duplicate-item1">Something1</div>
    <div id="duplicate-item2">Something2</div>
    <div id="duplicate-item3">Something3</div>
</div>

有什么想法吗？

更新：我可以尝试.clone（），但也会查看你们在下面发布的代码。提前谢谢..

原来.clone（）就是解决方案..

$('.hello').clone().appendTo('.goodbye');

我怎样才能将.above转变为更全球化？假设我有20个需要克隆的div？

Answer 1

$("#real-content").find("div").each(function(){
   var ID = $(this).attr("id").split("-");
   $(this).html($("#"+ID[1]).html());
});

Answer 2

$('#idContainerWithHiddenDivs div').each(function(){
    var idToCopy = $(this).attr('id');
    vat newID = 'duplicate-'+idToCopy;
    var $newDiv = $(this).clone().attr('id', newID);
    $('#real-content').append($newDiv);
});

我认为这是一个很好的方法。

快速示例：http://jsfiddle.net/TQdrH/6/更正了小提琴手，最后一个不起作用。

或许你可能想要使用这个：http://jsfiddle.net/TQdrH/11/或者你可能想在上次评论后尝试：http://jsfiddle.net/TQdrH/14/。

jquery在页面加载时复制div到div

2 个答案: