JavaScript页面打印(只打印指定部分)

简介:

实现思路:

1.在要打印的内容前后插入占位符;
2.页面显示需要打印的内容;
3.再调用浏览器的打印功能就可以了;

将下面代码单独保存为html文件,即可预览效果。

<script language="Javascript">
    function preview() {
        bdhtml = window.document.body.innerHTML;
        sprnstr = "<!--startprint-->";
        eprnstr = "<!--endprint-->";
        prnhtml = bdhtml.substr(bdhtml.indexOf(sprnstr) + 17);
        prnhtml = prnhtml.substring(0, prnhtml.indexOf(eprnstr));
        window.document.body.innerHTML = prnhtml;
        window.print();
    }
</script>
<!--省略部分代码-->
<form id="WebForm1" method="post" runat="server">
<center>
    本部分以上不被打印</center>
<!--startprint-->
<div align="center">
    <table style="width: 900px; border: solid 1px black;">
        <tr>
            <td>
                打印内容 打印内容 打印内容 打印内容
            </td>
        </tr>
        <tr>
            <td>
                打印内容 打印内容 打印内容 打印内容
            </td>
        </tr>
        <tr>
            <td>
                打印内容 打印内容 打印内容 打印内容
            </td>
        </tr>
        <tr>
            <td>
                打印内容 打印内容 打印内容 打印内容
            </td>
        </tr>
    </table>
</div>
<!--endprint-->
<center>
    本部分以下不被打印</center>
<div align="center">
    <input type="button" name="print" value="预览并打印" onclick="preview()">
</div>
<p class="Noprn">
    不打印</p>
<table id="datagrid">
    <tr>
        <td>
            打印
        </td>
    </tr>
</table>
<input class="Noprn" type="button" onclick="window.print()" value="print">
</form>

目录
相关文章
|
7天前
|
JavaScript 前端开发 容器
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
11 0
|
26天前
|
JavaScript 前端开发 Java
springboot从控制器请求至页面时js失效的解决方法
springboot从控制器请求至页面时js失效的解决方法
15 0
springboot从控制器请求至页面时js失效的解决方法
|
1月前
|
Web App开发 前端开发 JavaScript
编程笔记 html5&css&js 004 我的第一个页面
编程笔记 html5&css&js 004 我的第一个页面
|
3月前
|
JavaScript
如何使用JS控制指定页面大小开启全屏和退出全屏
如何使用JS控制指定页面大小开启全屏和退出全屏
25 0
|
3月前
|
JavaScript 数据安全/隐私保护
|
3月前
|
JavaScript
如何在JS中实现修改URL参数而不刷新页面
如何在JS中实现修改URL参数而不刷新页面
59 1
|
3月前
|
存储 JavaScript
JS中从a页面跳转到b页面,自动执行一次点击事件
JS中从a页面跳转到b页面,自动执行一次点击事件
|
26天前
|
JavaScript 前端开发
springboot+layui从控制器请求至页面时js失效的解决方法
springboot+layui从控制器请求至页面时js失效的解决方法
15 0
|
3月前
|
JavaScript
如何用js在页面中添加元素?
如何用js在页面中添加元素?
24 0
|
15天前
|
JavaScript 前端开发
JS:如何创建新元素并添加到页面中
JS:如何创建新元素并添加到页面中
21 1