克隆行不克隆TR

Question

我试图克隆表row。但我只能克隆什么里面没有tr标签。请检查我的脚本

$(".tr_clone_add").on('click', function() { 
 
    $('.tr_clone').last().clone({ 
 
    withDataAndEvents: true 
 
    }).insertBefore('.tr_clone_add:first'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 

 
<table class="table table-striped table-bordered" cellspacing="0" width="100%"> 
 

 
    <thead> 
 
    <tr> 
 
     <td>Hari</td> 
 
    </tr> 
 
    </thead> 
 

 

 
    <tbody> 
 
    <tr class="tr_clone"> 
 
     <td> 
 
     <select id="dropdown" class="form-control" name="hari[]"> 
 
      <option>Senin</option> 
 
      <option>Selasa</option> 
 
      <option>Rabu</option> 
 
      <option>Kamis</option> 
 
      <option>Jumat</option> 
 
     </select> 
 

 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
<input type="button" name="add" value="Tambah Baris" class="tr_clone_add">

我怎样才能解决这个问题？对不起，我的英语不好。

Answer 1

首先注意，clone()接受一个布尔值作为第一个参数，而不是一个对象。

其次您的问题是，因为你的按钮之前追加tr元素，而不是在表内。相反，尝试使用appendTo('table tbody')这样的：

$(".tr_clone_add").on('click', function() { 
 
    $('.tr_clone').last().clone(true).appendTo('table tbody'); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" /> 
 

 
<table class="table table-striped table-bordered" cellspacing="0" width="100%"> 
 
    <thead> 
 
    <tr> 
 
     <td>Hari</td> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr class="tr_clone"> 
 
     <td> 
 
     <select id="dropdown" class="form-control" name="hari[]"> 
 
      <option>Senin</option> 
 
      <option>Selasa</option> 
 
      <option>Rabu</option> 
 
      <option>Kamis</option> 
 
      <option>Jumat</option> 
 
     </select> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 

 
<input type="button" name="add" value="Tambah Baris" class="tr_clone_add">