Question

我已经创建了输入字段但是当我点击前两个时，它确实很好，直到我请求第三个介于前两个之间，而另一个也介于两者之间。请帮助我。这是我的javascript代码：

<script type="text/javascript">

    $(document).ready(function() {

    it to after "after-add-more" div class.
      $(".add-more").click(function(){ 
          var html = $(".copy-fields").html();
          $(".after-add-more").after(html);
      });

      $("body").on("click",".remove",function(){ 
          $(this).parents(".control-group").remove();
      });

    });

</script>

Answer 1

＆＃13;

$(document).ready(function() {
    $(".add-more").on('click', function(){ 
        var html = $(".copy-fields").clone();
        $(".after-add-more").after(html[0]);
    });

    $("body").on("click",".remove",function(){ 
        $(this).parents(".control-group").remove();
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div>
  <button class = "add-more">ADD</button>
  <div class = "after-add-more"></div>
  <div class = "copy-fields"><input type = "text" /></div>
</div>

＆＃13;

因为您正在尝试复制类.copy-fields的html内容，请使用clone（）代替html（），然后使用html [0]进行插入，如下所示：

$(document).ready(function() {
    $(".add-more").click(function(){
        var html = $(".copy-fields").clone();
        $(".after-add-more").after(html[0]);
    });

    $("body").on("click",".remove",function(){ 
        $(this).parents(".control-group").remove();
    });
});

如何使用bootstrap创建动态输入字段

1 个答案: