jquery如何克隆引导行

Question

我正在尝试克隆引导行，但每次我都会得到多行(1-2-4-8-等)

$("#clone").click(function() {
    $(".cloned-row:first").clone().insertAfter(".cloned-row");
});

HTML

 <div class="cloned-row">
    <div class="row">
        <div class="col-md-4">
            <div class="form-group">
                <label class="control-label" for="foo">Foo</label>
                <input type="text" class="form-control" name="foo[]" />
            </div>
        </div>
        <div class="col-md-4">
            <div class="form-group">
                <label class="control-label" for="bar">bar</label>
                <input type="text" class="form-control" name="bar[]" />
            </div>
        </div>
    </div>
</div>


<div class="row">
    <div class="col-md-2">
        <input type="button" class="form-control btn-info" value="clone" id="clone">
    </div>
    <div class="col-md-2">
        <input type="button" class="form-control btn-danger" value="remove" id="remove">
    </div>
</div>

我怎样才能一次只克隆一个 div 克隆行？ 谢谢您

Answer 1

您只需使用 insertAfter(".cloned-row") 告诉它在每个克隆行之后插入。这会导致您意想不到的额外克隆。

只需使用 :last 在最后一个之后插入

例如

insertAfter(".cloned-row:last")

JSFiddle: http://jsfiddle.net/TrueBlueAussie/u8zdutfy/