jquery - 如何动态地将数据从div正确复制到新窗口

Question

我有一个问题。我正在尝试创建一个非常简单的打印预览，当用户单击“打印预览”按钮时，它将打开一个新窗口并复制我想要的数据。有一些元素(例如复选框)我不想包含，但我能够成功完成。我的问题是，当加载新窗口时，原始 div 也会改变。就像原始 div 中的复选框被删除一样，Print 按钮也会出现。

我希望我的原始 div (divData) 保持不变。我对新窗口没有任何问题。

顺便说一句，我的 jquery 代码如下:

        $("#btnPrintPreview").click (function () {
            var printContents = new $("#divData");
            var myWindow = window.open("", "popup","width=1000,height=600,scrollbars=yes,resizable=yes," +  
                "toolbar=no,directories=no,location=no,menubar=no,status=no,left=0,top=0");
            var doc = myWindow.document;
            doc.open();
            $(printContents).find(".tCheckboxes").remove();
            var button = "<input type='button' id='btnPrint' value='Print' style='float: right;' onclick='window.print();'/>";
            $(printContents).append($(button));
            doc.write($(printContents).html());
            doc.close();
        });

要在此处查看我的演示，请点击链接 http://jsfiddle.net/dU7et/ 。

PS:请点击打印预览后检查主div。

请帮助我......

Answer 1

要执行您想要的操作，请将以下行更改为:

// Before:
var printContents = new $("#divData");
// After:
var printContents = $("#divData").clone();

参见http://api.jquery.com/clone/以供进一步引用。