Question

基本上我希望在单击添加按钮（最后一个div）时复制它，但在名称上添加一个_1

  <div class="form-group">
    <div class="col-sm-2">Size</div>
         <div class="col-lg-3">
             {{ Form::select('size', $sizes, null, ['class' => 'form-control'])}}
         </div>

        <div class="col-sm-1">Colour</div>
         <div class="col-lg-2">
             {{ Form::select('colour', $colours, null, ['class' => 'form-control'])}}
         </div>
         <div class="col-sm-1">Stock</div>
          <div class="col-lg-2">
              <input type="text" name="stock" class="form-control">
          </div>

          <div class="col-md-1">
          <!--- WHEN THIS IS CLICKED ----->
            <a class="btn btn-primary btn-sm" id="add"><i class="fa fa-plus"></i> Add</a>
          </div>
       </div>

当我点击添加按钮时，我希望再次显示整个表单组，在名称中添加下划线和数字也可以停止重复输入。

所以使用jQuery的东西我认为应该这样做，但是一个jQuery新手我不知道该写什么。

因此，在单击添加按钮时，它需要再次在已存在的那个下方显示整个表单组div，还要在name属性中添加下划线和数字以在保存到DB时停止重复条目

Answer 1

下面的代码应该复制块并将新副本附加到正文，最外层div的名称设置为... a_x 如果我问的是你想要的问题

 var  x = 0;
    $("#add").click(function(){ 
      x++;
      $('.form-group:first').clone().attr("name", "a_"+x).appendTo($('body'));
      alert(x);
    });

来自w3Schools http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_html_clone

的链接

用JS添加额外的行

1 个答案: