Question

如何在其他div（container2）

中显示用户更新的div（container1）的内容

 <div id="container1">
   <div id="slide1"> Content here include input box, select dropdown, normal text </div>
   <div id="slide2"> Editable Table </div> 
   <div id="slide3"> Editable images </div>

   //Each slide will be hidden after it is updated
</div>

<div id="container2">
//Basically this is editable summary of all the slides
//But by using clone, only empty text box/dropdowns are displayed
//How to display the contents of updated slide1, slide2 and slide3 so that it can be editable like in previous container1 (replicating the container1)

</div>

Answer 1

如果你想追加：

$("#container2").append($("#container1").clone().children());

Demo

如果要替换：

$("#container2").empty().append($("#container1").clone().children());

Answer 2

使用jquery：

$("#container2").html($("#container1").html());

Answer 3

＆＃13;

  $(function() {

	  $("#click").click(function(){
		  $("#container2").append($("#container1").clone());
	  });
	  });

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container1">
   <div id="slide1"> Content here include input box, select dropdown, normal text </div>
   <div id="slide2"> Editable Table </div> 
   <div id="slide3"> Editable images </div>
</div>

<div id="container2">

</div>
 <button id="click">Clone It!</button>

＆＃13;

Answer 4

使用它 $（ “＃container2的”）附加（$（ “＃container1”）HTML（））;

如何将div内的内容克隆到其他div

4 个答案: