將表行復制到另一個表會從父表中刪除行

Question

我將首先解釋我想要做什么：

1. 將一個表復制到另一個動態創建的表。
2. 打印動態創建的表。

但是，一旦我將一個表復制到另一個表，它就會從父表中刪除行。 請參閱我所做的以下代碼：

 $('#anchorPrint').click(function () 
    {           
        //create a new table dynamically.           
        $("<table>", {id: "tblTransactionHistory_copy",'display':'none'}).appendTo("body");
        $('#tblTransactionHistory_copy').append("<tbody></tbody>");

        //copy the main table rows to dynamically created one.
        var rows = $('#tblTransactionHistory > tbody > tr');
        $("#tblTransactionHistory_copy > tbody").append(rows);


        var divToPrint=document.getElementById("tblTransactionHistory_copy");
        newWin= window.open("");
        newWin.document.write(divToPrint.outerHTML);
        newWin.print();
        newWin.close(); 
        return false;
    });

Answer 1

不要讓任務太復雜，使用.clone()代替。

 $('#anchorPrint').click(function(){           
   var tblCopy = $("body").append($('#tblTransactionHistory').clone().attr("id","tblTransactionHistory_copy"));
   var divToPrint = tblCopy.get(0);
   var newWin= window.open("");
   newWin.document.write(divToPrint.outerHTML);
   newWin.print();
   newWin.close(); 
   return false;
 });

您的代碼不起作用的原因是，如果您將document任何現有元素作為selector或作為element傳遞，它將從其原始位置移出並附加到目標元素。