製作HTML部門的克隆

-1

我有兩個HTML部門幾乎相同。我需要在第一個div後添加第一個div的克隆，但在第二個div之前。製作HTML部門的克隆

這是我試過的代碼。

<body> 


     <div id="2ndPayDiv"> 
      <label id="2ndPayLbl">Payment No 2: </label> 
      <input type="text" /> 
      <input type="text" /> 
     </div> 

     <div id ="totPayForm" > 
      <label id="2ndPayLbl">Total Payment: </label> 
      <input type="text" /> 
      <input type="text" /> 
      <input type="submit" value="Add new one" onclick="addNewField();return false;"> 
     </div> 

     <script> 
      var i=3; 
      function addNewField() { 

       var myDiv = document.getElementById("2ndPayDiv"); 
       var divClone = myDiv.cloneNode(true); // the true is for deep cloning 

       var totDiv = document.getElementById("totPayForm"); 
       var parentDiv = totDiv.parentNode; 
       parentDiv.insertBefore(divClone, totDiv); 

       document.getElementById('2ndPayLbl').innerHTML = 'Payment No '+i++ +':'; 

      } 
     </script> 


    </body>

我的第一個div是2ndPayDiv。我需要在它後面有一個克隆，但在每次單擊按鈕時在div totPayForm之前。但它表現出色。它創建克隆並將其放在一切之前。我該如何解決這個問題

來源

2014-09-03 buddhi weerasinghe

標記爲'jquery'但沒有任何'jquery'在你的代碼。 – 2014-09-03 18:24:38

我不記得我最後一次聽到有人稱'div爲「divisions」:) – LcSalazar 2014-09-03 18:28:15

這可以用jQuery在一行中完成，你有一個jQuery標記...你想要一個jQuery的答案？ – 2014-09-03 18:36:24

爲什麼不把2ndPayDiv包裝在一個div中，並使用appendChild？

<div> 
     <div id="2ndPayDiv"> 
      <label id="2ndPayLbl">Payment No 2: </label> 
      <input type="text" /> 
      <input type="text" /> 
     </div> 
    <div>

JS：

 function addNewField() { 

      var myDiv = document.getElementById("2ndPayDiv"); 
      var divClone = myDiv.cloneNode(true); // the true is for deep cloning 

      var parentDiv = myDiv.parentNode; 
      parentDiv.appendChild(divClone); 

      document.getElementById('2ndPayLbl').innerHTML = 'Payment No '+i++ +':'; 

     }

來源

2014-09-03 18:33:55 LcSalazar

這不符合預期的要求。新創建的div放在所有東西之前，倒數第二個div放在所有東西之後。 – 2014-09-04 01:12:29

製作HTML部門的克隆

回答

相關問題