複印TR元件和附加到外部源，如果複選框被標記

Question

我有這樣的jQuery代碼：

$('button#btnBuscar').on('click', function (ev) { 
    ev.preventDefault(); 

    $.post(Routing.generate('filtrarNormas'), $('#buscadorNorma').serialize(), 'json') 
      .done(function (data, textStatus, jqXHR) { 
       if (data.entities.length > 0) { 
        $('#resultadoNorma').show(); 

        var $html = ''; 
        data.entities.forEach(function (value, index, array) { 
         $html += '<tr>'; 
         $html += '<td><input type="checkbox" value="' + value.id + '"></td>'; 
         $html += '<td>' + value.codigo + '</td>'; 
         $html += '<td>' + value.norma + '</td>'; 
         $html += '<td>' + value.anno + '</td>'; 
         $html += '<td>' + value.comiteTecnico + '</td>'; 
         $html += '</tr>'; 
        }); 

        $("table tbody#resultadoNormaBody").html($html); 
       } 
      }) 
      .fail(); 
}); 

上述代碼的目的是爲執行一個Ajax調用並呈現許多tr作爲值在JSON響應獲得，這工作正常。現在你可以看到每次迭代的第一列都有一個複選框，對吧？

我需要做的是在當前複選框被選中並追加時複製完整行（tr），而不重複相同的內容並且不擦除其他表內容到另一個表中。可能有很多可能的解決方案，但現在（根據@ josh-kg）建議其中一個可能會標記複選框，並立即克隆當前的tr元素，它會工作，是的，但是如果我切換複選框會發生什麼幾次？同一行將追加到#newTable，這不是主意。使用提供的解決方案，然後我應該將克隆切換到附加/刪除克隆的tr。

我在想有一個按鈕（button#btnAplicarNorma），默認情況下是禁用的，如果我至少有一個複選框被標記，然後啓用它並點擊按鈕的事件，通過迭代每個標記的複選框來完成克隆部分，例如：

$('button#btnAplicarNorma').on('click', function (ev) { 
    // check if at least there is one checkbox marked and enable the button 
    // check which checkboxes are marked and clone the current element 
}) 

但我該怎麼做？

注：其中tr應該是克隆的表是不是在模式本身，而是在同一個頁面所以這不應該是一個問題

Answer 1

$('#resultadoNormaBody').on('change','input[type=checkbox]',function(){ 
    var my_checkbox = $(this); 
    if (my_checkbox.is(':checked')) { 
     my_checkbox.closest('tr').clone().appendTo('#newtable'); 
    } 
}); 

UPDATE（OP預期的做了一些澄清後行爲）：

有按鈕默認被禁用，包括HTML標記disabled屬性：

<button id="btnAplicarNorma" disabled>Copy Rows</button> 

然後，使臀部當至少有一個複選框被選中時：

$('#resultadoNormaBody').on('change','input[type=checkbox]',function(){ 

     var $my_checkbox = $(this); 
     var $my_tr = $my_checkbox.closest('tr'); 

     if ($my_checkbox.prop('checked')) { 

       // Add the class to mark that it should be copied later when button clicked 
       $my_tr.addClass('copyMe'); 

     } 

     var $all_checkboxes = $my_checkbox.closest('tbody').find('input[type=checkbox]'); 

     // Loop through checkboxes to see if one is checked 

     $all_checkboxes.each(function() { 
      // if one checkbox is checked, enable button and end the .each loop 

      if ($(this).prop('checked')) { 

       $('#btnAplicarNorma').prop('disabled',false); 
       return false; 

      } 

      // If we didn't catch any checked boxes earlier, disable the button 

      $('#btnAplicarNorma').prop('disabled',true); 

     }); 

}); 

$('#btnAplicarNorma').on('click', function (ev) { 

    var $tr_to_append = $('#resultadoNormaBody').find('tr.copyMe'); 

    // is there's a tr to copy, clone it, append, and remove the copyMe classes 
    if ($tr_to_append.length) { 
     // first uncheck all the checkboxes 
     $tr_to_append.find('input[type=checkbox]').prop('checked',false); 
     // copy and append and remove class 
     $tr_to_append.clone().appendTo('#newtable').removeClass('copyMe'); 
     $tr_to_append.removeClass('copyMe'); 
     // disable the button again 
     $(this).prop('disabled',true); 
    } 

});