html中的打印预览页面

最新推荐文章于 2025-03-22 21:45:00 发布
最新推荐文章于 2025-03-22 21:45:00 发布
阅读量966 收藏
点赞数
文章标签： html中的打印预览页面
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/jia814583973/article/details/102609516
版权

html中的打印预览页面

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>总分环比统计查询</title>
</head>

<body>
<div class="g0_container">
    <div class="g0_ydpm_c" id="printdiv">
        <p><span><%=lastMonth%></span>至<span><%=now%></span>总分环比统计情况</p>
        <table class="g0_table" >
            <thead>
                <tr>
                    <th>序号</th>
                    <th>单位名称</th>
                    <th>1月</th>
                    <th>环比</th>
                    <th>2月</th>
                    <th>环比</th>
                    <th>3月</th>
                    <th>环比</th>
                    <th>4月</th>
                    <th>环比</th>
                    <th>5月</th>
                    <th>环比</th>
                    <th>6月</th>
                    <th>环比</th>
                    <th>7月</th>
                    <th>环比</th>
                    <th>8月</th>
                    <th>环比</th>
                    <th>9月</th>
                    <th>环比</th>
                    <th>10月</th>
                    <th>环比</th>
                    <th>11月</th>
                    <th>环比</th>
                    <th>12月</th>
                    <th>环比</th>
                </tr>
            </thead>
            <tbody id="resTable">
                <tr>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                    <td>1</td>
                </tr>
            </tbody>
        </table>
        <div class="g0_btn_c" style="display: none">
            <a href="###" class="g0_btn g0_mr_24" onclick="windowprint()">打印</a>
        </div>
    </div>
</div>
</body>
<script type="text/javascript" src="<%=basePath%>/common/js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="<%=basePath%>/common/layer3.1/layer.js"></script>
<script type="text/javascript">

// 打印
function windowprint() {
    $(".g0_btn_c").hide();
    var headhtml = "<html><head><title></title></head><body>";
    var foothtml = "</body>";
    // 获取div中的html内容
    $(".rank-1").html("1");
    $(".rank-2").html("2");
    $(".rank-3").html("3");
    var newhtml= $("#printdiv").html();
    // 获取div中的html内容，jquery写法如下
    // var newhtml= $("#" + printpage).html();

    // 获取原来的窗口界面body的html内容，并保存起来
    var oldhtml = document.body.innerHTML;

    // 给窗口界面重新赋值，赋自己拼接起来的html内容
    document.body.innerHTML = headhtml + newhtml + foothtml;

    // 调用window.print方法打印新窗口
    window.print();

    // 将原来窗口body的html值回填展示
    document.body.innerHTML = oldhtml;`在这里插入代码片`
    $(".rank-1").html("");
    $(".rank-2").html("");
    $(".rank-3").html("");
    $(".g0_btn_c").show();
    return false;
}
</script>
<script type="text/javascript" src="<%=basePath%>/common/js/jquery-1.9.1.min.js"></script>
</html>

第一篇文章 谢谢大家支持！

jia814583973
关注
qt html 打印预览,如何在QT中嵌入打印预览对话框
weixin_34961316的博客
07-22 690
最后我只是从我的问题中找到答案。我希望它会对其他人有所帮助。我使用了QPrintPreviewWidget。请看代码......Widget::Widget(QWidget *parent, QWidget *report) :QWidget(parent),ui(new Ui::Widget){ui->setupUi(this);printer = new QPrinter(QPrinte...
html页面实现pdf打印预览,利用pdfjs在线预览、打印pdf
weixin_36400833的博客
06-03 2121
目录环境准备1.在官网下载pdf.js2.下载源码包3.构建pdf.js代码4.pdf.js代码结构图5.pdf.js放入web容器6.通过浏览器访问实际使用1.打开指定pdf2.打开指定pdf文件流环境准备1.在官网下载pdf.js我们可以通过官网直接下载pdf.jshttp://mozilla.github.io/pdf.js/官网2.下载源码包如果选择了步骤一，可以直接看步骤4pdf.js ...
html调用打印机打印（可预览）
11-02
在html中的input里输入什么内容就预览、打印什么内容。很方便、实用。
Html实现打印、预览
09-14
Html实现打印、预览
HTML网页代码实时效果预览器
最新发布
cnds123的专栏
03-22 1010
HTML网页代码预览器。可以用于学习和实验HTML和CSS，实时效果预览，比较便捷。
html实现打印预览效果
小屁孩大帅-保密的博客
11-29 890
效果如下： 方式一 1、设置div，打印区域，最好是单放在一页，因为需要打印的是该页所有内容 <div id="contractContent" style="width: fit-content"></div> 2、拼接div中需要的文本，可以设置动态数据填充 var contractContent = ''; c...
html调用打印机打印（可预览）样式css
11-02
html打印布局的样式，网页一打开或者刷新后input自动默认光标在中间。
html打印预览
12-30
实现html中的打印预览
js实现html中的pdf文件的在线预览、下载、打印等功能
07-06
本篇文章将深入探讨如何使用JavaScript实现HTML中的PDF文件在线预览、下载以及打印功能。我们将首先介绍相关的JavaScript库，然后通过一个简单的示例演示如何实现这些功能。 一、JavaScript PDF处理库 1. **PDF.js...
javascript打印大全(打印页面设置/打印预览代码)
12-02
在提供的代码示例中，我们看到两个主要的函数，`printsetup()` 和 `printpreview()`，它们分别用于设置打印选项和预览页面，而`printit()` 函数则用于执行实际的打印操作。 首先，`printsetup()` 函数调用了 `wb....
html 打印
dianzongfan5428的博客
02-14 115
【转载，出处未知，】，红色内容已测试，其余未测试。在打印HTML页面时控制分页2011年12月22日 星期四 下午 9:31打印分页功能:page-break-after, page-break-before根据资料上的说法,应该是这么用的:<style type=“text/css“>.pageEnd {page-break-after:always}</styl...
网页打印问题集锦（页面设置、打印预览）
11-29
我们在开发web报表时，经常需要将网页中的报表打印下来
网页打印问题，打印设置，打印预览，打印分页，纵打，横打及页面的边距
09-30 6537
1、控制"纵打"、 横打”和“页面的边距。 （1） function SetPrintSettings() { // -- advanced features factory.printing.SetMarginMeasure(2) // measure margins in inches factory.SetPageRange(false, 1, 3) // need pages from 1
html 点击打印预览,不预览即打印WebBrowser，即单击打印
weixin_32199821的博客
07-03 538
小编典典我有一个示例控制台应用程序，该应用程序使用WinForms打印一组HTML文件WebBrowser。您DoWorkAsync实际上可以在WinForms应用程序中借用它的一部分来完成打印任务，而无需进行任何更改：// by Noseratio - http://stackoverflow.com/users/1768303/noseratiousing System;using Syste...
html页面实现打印预览功能,js实现打印、页面设置、打印预览功能
weixin_35905707的博客
06-03 608
javascript打印-打印页面设置-打印预览代码function printsetup(){// 打印页面设置wb.execwb(8,1);}function printpreview(){// 打印页面预览wb.execwb(7,1);}function printit(){if (confirm(’确定打印吗？’)) {wb.execwb(6,6)}}classid=CLSID:8856F...
打印预览html页面
jjx307998840的专栏
12-11 1512
打印练习<!--.noprint { display: none }-->.noprint { display: none }<!--var now = new Date();var time = now.toLocaleString();time="访问时间："+time+""; function init() { document.ge
html 打印预览页面背景,HTML 怎么写一个打印预览页面？
weixin_36472718的博客
06-03 172
Insert title herefunction PReview(oper){if (oper < 10){bdHTML=Window.document.body.innerHTML;//获取当前页的HTML代码sPRnstr="";//设置打印开始区域ePRnstr="";//设置打印结束区域PRnHTML=bdHTML.SUbstring(bdHTML.indexOf(sPRnstr)...
html页面实现打印预览功能,javascript 打印、设置、预览的实现代码
weixin_42372573的博客
06-03 1231
javascript 打印、打印设置、打印预览的例子。1、javascript打印-打印页面设置-打印预览复制代码 代码示例:javascript打印-打印页面设置-打印预览代码function printsetup(){// 打印页面设置wb.execwb(8,1);}function printpreview(){// 打印页面预览wb.execwb(7,1);}function printi...
在web html页面中，打印、预览当前页面
热门推荐
hoojo
06-17 1万+
最近的项目需要简单的实现一下打印当前页面的数据，有分页打印的功能。下面的一段代码可以帮助我们实现简单的打印功能，要想实现复杂的打印那需要利用其他的打印控件。这里就不提了！
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值