如何附加整个< div> [英] How to append the whole <div>

问题描述

    <div class="rows">
       <input type="text" id="ip1" class="ip1">
       <input type="text" id="ip2" class="ip2">
       <input type="button" value="Delete" id="del" class="del">                        
    </div><!--Rows-->

    <script>
      $(document).ready(function(e){
         $("#add").click(function(e){
            $(".rows").append('<input type="text" id="ip1" class="ip1">'+
            '<input type="text" id="ip1" class="ip1">'+
            '<input type="button" alue="Delete" id="del" class="del">');
         });
      });
    </script>

我使用此方法做到了这一点.是否有其他好的方法，例如附加整个div. 如果我单击删除"按钮，则需要单独删除该行， 谢谢

I Did this using this method. Is there any other good method like appending the whole div. and i need to delete that row alone if i click delete button, Thanks

推荐答案

为避免ID重复，您可以通过以下方式进行操作:

To avoid duplicated id's you can do that in this way : http://jsbin.com/xotoyogo/1/edit?html,js,output

JS:

  $(document).ready(function(e){
         $("#add").click(function(e){
           var newId = $('.row').length + 1;

           $(".container")
           .append('<div class="row"><input type="text" id="ip' + newId+'" class="ip1"> '+
          '<input type="text" id="ip'+newId+'" class="ip1"> '+
          '<input type="button" value="Delete" id="del'+newId+'" class="del"></div>');
         });
      });

HTML:

<div class="container">
<div class="row">
       <input type="text" id="ip1" class="ip1">
       <input type="text" id="ip2" class="ip2">
       <input type="button" value="Delete" id="del" class="del"> 

    </div><!--Rows-->
  </div>
  <button id="add">add</button>

这篇关于如何附加整个< div>的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！