jQueryクローンは一度に2つのテーブル行を返します。必要があります

Question

なぜjQueryクローンは一度に2つのテーブル行を返すのですか？私はそれがリンクの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'); 
});