如何在按钮上方而不是在下方添加重复div

时间:2016-01-19 16:23:11

标签: jquery html

我想在'addrow'按钮上方添加id名称为bakkant的div,而不是在其下方。也出于某种原因,虽然它在Jsfiddle中完美地运行,但行显示然后在实践中立即消失)。这样做的最佳方法是什么? https://jsfiddle.net/j3xazjak/3/

        <div class="shape" id="plan4_shape">
            <span class="bakkant">
            <input class="measures" id="plan4_width" placeholder="mm"/><span class="times"> &times;</span> <input class="measures" id="plan4_width" placeholder="mm"/>
             </span>
            <span class="bakkant" id="bakkant">
            <input class="measures" id="plan4_width" placeholder="mm"/><span class="times"> &times;</span> <input class="measures" id="plan4_width" placeholder="mm"/><button class="close" value="close1">&times;</button>
            </span>
            <button name="add_row" class="addrow" id="addrow4" onClick="addrow()">Add row</button>
        </div>

Jquery的

$( document ).ready(function() {
document.getElementById('addrow4').onclick = duplicate;

var i = 0;
var original = document.getElementById('bakkant');

function duplicate() {

    var clone = original.cloneNode(true);
  clone.id = "bakkant" + ++i; 
  original.parentNode.appendChild(clone);

}
/* var clone = original.cloneNode(true); // "deep" clone
    clone.id = "duplicetor" + ++i; // there can only be one element with an ID
    original.parentNode.appendChild(clone);
    */
  /*  jQuery('.four').before('<div class="addme">Add Me!</div>'); */
    });  

1 个答案:

答案 0 :(得分:3)

使用insertBefore

original.parentNode.insertBefore(clone, original);