jquery如何克隆bootstrap行 [英] jquery how clone bootstrap row

查看:90
本文介绍了jquery如何克隆bootstrap行的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试克隆一个bootstrap行,但每次我得到一个多行(1-2-4-8-etc)

I'm trying to clone a bootstrap row but every time I get a multiple-line (1-2-4-8-etc)

$("#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克隆行?
谢谢

How could I do to clone only a div cloned-row at a time? Thank You

推荐答案

您只是告诉它在每个克隆行之后插入 insertAfter( 克隆行)。这导致了你没想到的额外克隆。

You are simply telling it to insert after every cloned row with insertAfter(".cloned-row"). That is causing additional cloning you did not expect.

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

例如

insertAfter(".cloned-row:last")

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

这篇关于jquery如何克隆bootstrap行的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆