Question

我找到了这个printarea插件，请参阅http://plugins.jquery.com/project/PrintArea。

所以我的HTML中有一个部分，我要打印的部分页面。我把脚本放在下面。然而，当我打印一个页面时，它以横向格式而不是protrait格式出现。我该如何解决这个问题？此元素也会导致不必要的分页，我该如何解决？或者有更好的方法吗？

<script type="text/javascript" src="<%=Url.Content("~/Scripts/jquery.Printarea.js")%>"></script>

<script type="text/javascript">
    $(document).ready(function () {
        $("#btnPrintOnePage").click(function () {
            // Print the DIV.
            $(".printable").printArea();
            // Cancel click event.
            return (false);
        }
        )
        ;
    });
</script>

Answer 1

有几个选择。里程可能会有所不同。

根据需要生成PDF并打印出来。
，将页面设置为纵向，如@page {size:portrait;}或@page {size:8.5in 11in;}
，根据需要旋转内容。所以.printable{-moz-transform:rotate(-90deg) // other rotate styles etc.}

Answer 2

人们几乎无法控制网站的打印方式。无论是横向打印还是纵向打印，都取决于浏览器的打印设置。

某些元素可能会导致不必要的分页符。这些元素通常浮动或具有溢出设置或非常宽。您应该使用print css删除或重置这些值。您将找到有关打印优化的大量信息。一个例子是：http://www.webdesignerdepot.com/2010/01/10-tips-for-better-print-style-sheets/

TJ

Answer 3

要水平打印，应在标题中添加以下内容：

var options = { mode : "popup", popClose : true, extraHead : '<meta charset="utf-8"/>,<meta http-equiv="X-UA-Compatible" content="IE=edge"/>,<style rel="stylesheet" type="text/css" media="print">@page { size: landscape; }</style>' };

$("#form1").printArea(options);

Answer 4

感谢大家的帮助。我找到了我正在做的事情的解决方案，但我无法保证这是解决方案。我输入以下代码;

    <script type="text/javascript">
        $(document).ready(function () {
            $("#btnPrintOnePage").click(function () {
                // Print the DIV.
                $(".printable").printElement({
                    printMode: 'popup',
                    overrideElementCSS: ['<%=Url.Content("~/Content/print.css")%>']
                });
            }); 
        });
</script>

使用printElement插件（http://projects.erikzaadi.com/jQueryPlugins/jQuery.printElement/）我可以交换样式表，并且我可以更好地控制输出内容。

我想以纵向格式打印页面的一部分

4 个答案: