Javascript 如何使用JQuery克隆选定表行并隐藏原始表行

Javascript 如何使用JQuery克隆选定表行并隐藏原始表行,javascript,jquery,Javascript,Jquery,我想克隆选中的:选中的表行,并使用JQuery隐藏原始行。我想在克隆表中添加删除功能,并从克隆表头中删除复选框 以下是我的克隆代码: function getAddDetails(){ var srcrow = $('.content_value').has('input:checked'); var lastRow = srcrow.clone(); lastRow.each(function(index, row){ $(row).find('ch

我想克隆选中的:选中的表行,并使用JQuery隐藏原始行。我想在克隆表中添加删除功能,并从克隆表头中删除复选框

以下是我的克隆代码:

function getAddDetails(){ 

    var srcrow = $('.content_value').has('input:checked');
    var lastRow = srcrow.clone();
    lastRow.each(function(index, row){
        $(row).find('checked').each(function(idx, el){
            var el = $(el);
            el.val(srcrow.eq(index).find('select').eq(idx).val())
        });
    });

    $(".content_head").each(function(i, el) {
      $(this).closest('.content_head').clone().insertAfter(".content_value:last");
    });

    $('.content_value').has('input:checked').hide();
    var cloned =lastRow.closest('.content_value').clone().insertAfter(".content_head:last");
}
这是HTML代码:

 <tr class="content_head">
 <td class="tableheader"><input type="checkbox" name="select-all"  id="select-all" /></td>
  <td class="tableheader">ID</td>
  <td class="tableheader">Name</td>
  <td class="tableheader">Type</td>
</tr>
 <% @content.each do |f| %>
<tr class="content_value">
  <td bgcolor="#FBFBFB">
    <input type="checkbox" name="checkbox" id="chk" />
  </td>
  <td bgcolor="#FBFBFB">
    <%= f.id %>
  </td>
  <td bgcolor="#FBFBFB">
    <%= f.name %>
  </td>
  <td bgcolor="#FBFBFB">
    <%= f.type %>
  </td>
</tr>
 <% end %>
<tr>
 <td>&nbsp;</td>
 <td><input type="button" id="button" value="add" onclick="getAddDetails();" class="submit_btn" /></td>
</tr>
请建议。

试试这个


你能创建你的代码片段吗。。?或者,请添加HTML部分。我想从克隆表中删除复选框,并想在每一行中追加删除列。
$('#select-all').click(function(event) {   
    if(this.checked) {
      // Iterate each checkbox 
      $(':checkbox').each(function() {
          this.checked = true;                        
      });
    } else {
    $(':checkbox').each(function() {
      this.checked = false;                        
    });
  }



});



function getAddDetails(){ 
   var srcrow = $('.content_value').has('input:checked');
    var lastRow = srcrow.clone();
    lastRow.each(function(index, row){
      $(row).find('checked').each(function(idx, el){
          var el = $(el);
          el.val(srcrow.eq(index).find('select').eq(idx).val())
      });
    });


    $(".conten

t_head").each(function(i, el) {
      $(this).closest('.content_head').clone().removeClass('content_head').addClass('clone_content_head').insertBefore(".content_value:first");
    });

    //$('.content_value:last').append(lastRow);
    var cloned =lastRow.closest('.content_value').clone().removeClass('content_value').addClass('clone_content_value').insertAfter(".clone_content_head:last");
    $(':checkbox').each(function() {
      this.checked = false;                        
    });
           $('.content_value').remove();
   $('.content_head').remove();

    // $('.del').live('click',function(){
    //   $(this).parent().parent().remove();
    // });
  }
</script>