javascript - 单击按钮时的动态 DIV 元素

Question

我有一个场景，我需要在单击按钮时显示 DIV 元素，如果用户再次单击该按钮，我需要显示相同的 DIV 元素两次，依此类推，与用户单击按钮的次数相同。下面是DIV元素

                <div class="input-group" id="selection">
                  <span class="input-group-addon">
                    <i class="icon wb-menu" aria-hidden="true"></i>
                  </span>
                  <select class="show-tick" data-plugin="select2" >

                   <option>True</option>
                   <option>False</option>

                  </select>
                </div>

下面是按钮

<button class="btn btn-primary" 
              type="button" style="margin-left: 30px;">Add new selection</button>

Answer 1

您可以使用.clone()来实现此目的，

$(".btn").click(function () {
    var div = $(".input-group").last();
    div.after(div.clone());
});

Fiddle

clone() 将获取指定元素的副本。然后你可以使用last()或before()将元素添加到dom。

如果您有此 div 元素的容器，那么您也可以使用 append()