首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何在JavaScript中打印渲染的HTML页面的一部分?

如何在JavaScript中打印渲染的HTML页面的一部分?
EN

Stack Overflow用户
提问于 2009-07-02 00:25:30
回答 3查看 150.2K关注 0票数 71

JavaScript代码window.print()可以打印当前的HTML页。

如果我在一个超文本标记语言页面中有一个div (例如,一个从ASP.NET MVC视图呈现的页面),那么我只想打印这个div。

是否有任何jQuery unobtrusive JavaScript或普通JavaScript代码来实现此请求?

为了更清楚起见,假设呈现的HTML页面如下:

<html xmlns="http://www.w3.org/1999/xhtml">

    <head id="Head" runat="server">
        <title>
            <asp:ContentPlaceHolder runat="server" ID="TitleContent" />
        </title>
    </head>

    <body>
            <div id="div1" class="div1">....</div>
            <div id="div2" class="div2">....</div>
            <div id="div3" class="div3">....</div>
            <div id="div4" class="div4">....</div>
            <div id="div4" class="div4">....</div>
        <p>
            <input id="btnSubmit" type="submit" value="Print" onclick="divPrint();" />
        </p>
    </body>
</html>

然后我想点击Print按钮,只打印div3。

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2009-07-02 02:33:40

我会这样做:

<html>
    <head>
        <title>Print Test Page</title>
        <script>
            printDivCSS = new String ('<link href="myprintstyle.css" rel="stylesheet" type="text/css">')
            function printDiv(divId) {
                window.frames["print_frame"].document.body.innerHTML=printDivCSS + document.getElementById(divId).innerHTML;
                window.frames["print_frame"].window.focus();
                window.frames["print_frame"].window.print();
            }
        </script>
    </head>

    <body>
        <h1><b><center>This is a test page for printing</center></b><hr color=#00cc00 width=95%></h1>
        <b>Div 1:</b> <a href="javascript:printDiv('div1')">Print</a><br>
        <div id="div1">This is the div1's print output</div>
        <br><br>
        <b>Div 2:</b> <a href="javascript:printDiv('div2')">Print</a><br>
        <div id="div2">This is the div2's print output</div>
        <br><br>
        <b>Div 3:</b> <a href="javascript:printDiv('div3')">Print</a><br>
        <div id="div3">This is the div3's print output</div>
        <iframe name="print_frame" width="0" height="0" frameborder="0" src="about:blank"></iframe>
    </body>
</html>
票数 118
EN

Stack Overflow用户

发布于 2014-07-30 04:47:48

尝试以下JavaScript代码:

function printout() {

    var newWindow = window.open();
    newWindow.document.write(document.getElementById("output").innerHTML);
    newWindow.print();
}
票数 11
EN

Stack Overflow用户

发布于 2009-07-02 00:30:20

您可以使用打印样式表,但这将影响所有打印功能。

您可以尝试在外部设置一个打印样式表,当按下按钮时通过JavaScript包含该样式表,然后调用window.print(),然后删除它。

票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/1071962

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档