0

我有一个div.id target_wrapper

<div id="target_warpper">
      <div id="target">
      ///Some content here
      </div> 
</div>

打印页面的相应javascript函数是:

<div class="print_list">
                        <a href="javascript:PrintContent()">Print</a>
                    </div>

                    <script type="text/javascript">
                    function PrintContent() 
                    {


                        var DocumentContainer = document.getElementById('target_warpper');
                        var WindowObject = window.open('', 'PrintWindow', 'width=750,height=650,top=50,left=50,toolbars=no,scrollbars=yes,status=no,resizable=yes');


                        WindowObject.document.writeln('<!DOCTYPE html>');
                        WindowObject.document.writeln('<html><head><title></title>');
                        WindowObject.document.writeln('<link rel="stylesheet" type="text/css" href="css/print.css">');
                        WindowObject.document.writeln('</head><body>')

                        WindowObject.document.writeln(DocumentContainer.innerHTML);

                        WindowObject.document.writeln('</body></html>');

                        WindowObject.document.close();
                        WindowObject.focus();
                        WindowObject.print();
                        WindowObject.close();
                    }
                    </script>

但是当我点击Print链接时,出现的页面不包含css css/print/css我包含的内容。

注意:当我单击打印弹出窗口的查看页面源时,它显示为空白!

4

1 回答 1

3

这是一个示例,显示此代码在jsFiddle中工作。我包含 jQuery 只是为了使单击时的事件绑定更容易一些。

当您注释掉print()& close()- 它更容易检查发生了什么。在那个例子中,我似乎得到了你想要的。新窗口,正确的内容,带有正确属性link的标签。href

如果您在使用 css 文件时遇到问题,请仔细检查文件路径。为了更简单,您可能应该只指定 css 文件的完整 url http://example.com/css/print.css:.

于 2013-06-26T05:16:03.357 回答