jQuery克隆一次返回两个表行，需要一个

Question

为什么jQuery克隆一次返回两个表行？我希望它在时间上的链接的click返回tr：

<script type="text/javascript"> 
    $(".tr_clone_add").on('click', function() { 
     $('.tr_clone').clone(false).appendTo('table tbody'); 
    }); 
</script> 

HTML：

<th>Type</th> 
<th>Selection</th> 
<th>Description</th> 
<th>Unit</th> 
<th>Qty</th> 
<th>Incl. Price</th> 
<th>VAT Type</th> 
<th>Disc % </th> 
<th>Discount</th> 
<th>Exclusive</th> 
<th>Vat</th> 
<th>Total</th> 
<th></th> 

<tbody> 
    <!-- <input type="text" name="user" id="users" autocomplete="off"> --> 
    <tr class="tr_clone"> 
     <td> 
      <select class="form-control myselect" name="acc_type"> 
       <option selected="selected">Account</option> 
       <!-- <option>John Doe</option>--> 
      </select> 
     </td> 
     <td> 

      <select class="form-control myselect account" name="acc_no" onchange="get_quote($(this).val())"> 
       <option selected="selected">select Item</option> 
       <?php $accounts = $pdo->query("select acc_no,acc_name from coa")->fetchall();?> 
        <?php foreach($accounts as $item):?> 
         <option value="<?=$item['acc_no']; ?>"> 
          <?=$item['acc_name']; ?> 
         </option> 
         <?php endforeach;?> 
      </select> 

     </td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td> 
      <input type="text" name=""> 
     </td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td></td> 
     <td> 
      <!-- <a href="#" class="tr_clone_add"><i class="fa fa-plus" style="font-size: 16px"></i></a> &nbsp&nbsp --> 
      <input type="button" name="add" value="Add" class="tr_clone_add"> 
      <input type="button" name="add" value="Del" class="del"> 
     </td> 
    </tr> 
</tbody> 

Answer 1

您选择所有与类行。如果您不想选择所有行，则需要在克隆它之后删除该类。

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