js打印指定区域

最新推荐文章于 2024-08-01 15:06:06 发布
最新推荐文章于 2024-08-01 15:06:06 发布
阅读量131 收藏
点赞数
分类专栏： 综合技术
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/congine_mcfeng/article/details/83671567
版权
示例代码1 

<html> 

<head></head> 

<script language=javascript> 

function doPrint() { 

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>

<body> 

   <!--startprint-->
   <div id="print">要打印的内容</div> 
   <!--endprint-->


<INPUT onclick="doPrint()" type="button" value="打印"/> 

<body> 

</html>



示例代码2 

<script>
function print(d){
for(i=0;i<4;i++){
if(i==d) eval("div"+i).style.visibility="visible";
else eval("div"+i).style.visibility="hidden";
}
document.all.wb.ExecWB(7,1);
for(i=0;i<4;i++){
eval("div"+i).style.visibility="visible";
}
}
</script>
<div id=div0>
<OBJECT classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" height=0 id=wb name=wb width=0></OBJECT> 
<input type=button value=打印预览 onclick="wb.execwb(7,1)">
<input type=button onClick=document.all.wb.ExecWB(6,1) value="打印">
<input type=button value=打印表格1 onclick=print("1")>
<input type=button value=打印表格2 onclick=print("2")>
<input type=button value=打印3 onclick=print("3")>
</div>

<div id=div1>
表格一：<br>
<table>
<tr><td>1111</td><td>1111</td><td>1111</td></tr>
<tr><td>1111</td><td>1111</td><td>1111</td></tr>
<tr><td>1111</td><td>1111</td><td>1111</td></tr>
</table>
</div>
<div id=div2>
表格二：<br>
<table>
<tr><td>2222</td><td>2222</td><td>2222</td></tr>
<tr><td>2222</td><td>2222</td><td>2222</td></tr>
<tr><td>2222</td><td>2222</td><td>2222</td></tr>
</table>
</div> 

<div id=div3>
测试文字3333
测试文字3333
测试文字3333
测试文字3333
</div>


示例代码3 

<html> 
<head> 
<title>看看</title> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<!--media=print 这个属性可以在打印时有效--> 
<style media=print> 
.Noprint{display:none;} 
.PageNext{page-break-after: always;} 
</style> 

<style> 
.tdp 
{ 
border-bottom: 1 solid #000000; 
border-left: 1 solid #000000; 
border-right: 0 solid #ffffff; 
border-top: 0 solid #ffffff; 
} 
.tabp 
{ 
border-color: #000000 #000000 #000000 #000000; 
border-style: solid; 
border-top-width: 2px; 
border-right-width: 2px; 
border-bottom-width: 1px; 
border-left-width: 1px; 
} 
.NOPRINT { 
font-family: "宋体"; 
font-size: 9pt; 
} 

</style> 

</head> 

<body > 
<center class="Noprint" > 
<p> 
<OBJECT id=WebBrowser classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 width=0> 
</OBJECT> 
<input type=button value=打印 onclick=document.all.WebBrowser.ExecWB(6,1)> 
<input type=button value=直接打印 onclick=document.all.WebBrowser.ExecWB(6,6)> 
<input type=button value=页面设置 onclick=document.all.WebBrowser.ExecWB(8,1)> 
</p> 
<p> <input type=button value=打印预览 onclick=document.all.WebBrowser.ExecWB(7,1)> 
<br/> 
</p> 
<hr align="center" width="90%" size="1" noshade> 
</center> 

<table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp"> 
<tr> 
<td colspan="3" class="tdp">第1页</td> 
</tr> 
<tr> 
<td width="29%" class="tdp"> </td> 
<td width="28%" class="tdp"> </td> 
<td width="43%" class="tdp"> </td> 
</tr> 
<tr> 
<td colspan="3" class="tdp"> </td> 
</tr> 
<tr> 
<td colspan="3" class="tdp"><table width="100%" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td width="50%" class="tdp"><p>这样的报表</p> 
<p>对一般的要求就够了。</p></td> 
<td> </td> 
</tr> 
</table></td> 
</tr> 
</table> 
<hr align="center" width="90%" size="1" noshade class="NOPRINT" > 
<!--分页--> 
<div class="PageNext"></div> 
<table width="90%" border="0" align="center" cellpadding="2" cellspacing="0" class="tabp"> 
<tr> 
<td class="tdp">第2页</td> 
</tr> 
<tr> 
<td class="tdp">看到分页了吧</td> 
</tr> 
<tr> 
<td class="tdp"> </td> 
</tr> 
<tr> 
<td class="tdp"> </td> 
</tr> 
<tr> 
<td class="tdp"><table width="100%" border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td width="50%" class="tdp"><p>这样的报表</p> 
<p>对一般的要求就够了。</p></td> 
<td> </td> 
</tr> 
</table></td> 
</tr> 
</table> 
</body> 
</html>
congine_mcfeng
关注
专栏目录
JS打印指定区域，方便使用
07-16
一个使用js控制打印区域的小东东。方便使用
【JavaScript编程】前端如何实现局部打印（精确打印）
猿始森林
03-30 2742
在前端开发中实现精确打印控制（局部打印）
JS打印指定的id区域内容而不是完整的页面的解决办法
最新发布
tyzhsj的博客
08-01 531
JS打印指定的id区域内容的解决办法
JS打印页面指定区域
weixin_34387468的博客
09-18 206
错误的写法： //打印 function printPage(areaId) { if (parent.$("#PrinFrame").length == 0) { parent.$("body").append('<iframe id="PrinFrame" style="display: none; "></iframe>'); ...
js打印页面指定区域内容
MR_wb的博客
09-19 8360
js打印页面指定区域
JS 打印页面指定区域
weixin_45062076的博客
10-19 874
//先绑定打印后事件 也可以绑定打印前事件 把什么都隐藏 然后在显示 window.onafterprint = function () { window.location.reload(); } //打印前事件 window.onbeforeprint = function () { } var bd = window.document.body.innerHTML; begin = "<!--begin-->"; end = "<!--end-->"; var
调用浏览器打印功能_局部打印案例
BLUESKYHOST的博客
02-21 257
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>局部打印案例</title> <script type="text/javascript"> function doPrint() { bdhtml
关于js方法打印指定区域
philip421421的博客
04-26 969
最近测试目前系统关于ie11的兼容性问题，发现以前的打印页面无法使用了，js报错？比较奇怪的事情，于是调试发现调用的公共方法代码有问题。 js中，打印页面有window.print()方法，也有document.execCommand('print')对象解析方式，还有WebBrowser控件方式来实现，但公共方法中却是obj.document.execCommand...
js print打印网页指定区域内容的简单实例
11-28
<title>js print打印网页指定区域内容的简单实例 function myPrint(obj) { var newWindow = window.open("打印窗口", "_blank"); var docStr = obj.innerHTML; newWindow.document.write(docStr); newWindow...
JavaScript打印网页指定区域的例子
10-26
本文详细介绍了使用JavaScript打印网页指定区域的技术原理和实现方法。在网页设计和内容展示中，经常会遇到需要打印特定内容的需求，例如打印一张发票、一个表格或某个页面上的特定部分。传统的网页打印方法通常会...
window.print打印指定div指定网页指定区域的方法
09-04
主要介绍了window.print打印指定div指定网页指定区域的方法,需要的朋友可以参考下
js打印指定区域打印预览打印设置，简单方便
07-16
test.html 每个按钮调用一个函数，实现打印指定区域，可预览，可设置
PrintMe:一个简单的js文件打印库——打印特定区域，同时隐藏其他打印区域
06-22
PrintMe 是一个专门为 JavaScript 设计的轻量级打印库，其主要功能是允许用户打印页面中的特定区域，同时可以隐藏不希望在打印时显示的其他内容。这个库尤其适合那些需要对打印内容进行精确控制的网页应用。在本文中...
vue js打印指定区域
weixin_44622464的博客
06-23 924
print () { // 获取需要打印的区域 const printHTML = document.querySelector('#print').innerHTML window.document.body.innerHTML = printHTML window.print() // 刷新页面重新加载 window.location.reload() } 去除页眉页脚 @page { margin: 1mm; } 参考文章h
JavaScript实现打印指定区域的内容（附完整源码）
希望我的博客，能帮上你解决学习中工作中所遇到的问题
11-07 399
JavaScript实现打印指定区域的内容（附完整源码）
javascript 打印指定区域的内容
zdkjob专栏
11-01 1043
http://www.w3.org/1999/xhtml"> 打印指定区域的内容 body{ font-size:12px; color:#333; } #content{ border:solid 1px #333; background:#ffc; }     ///***********************     ///打印指定区域页面
js print打印网页指定区域内容
别在熬夜了！
03-24 1665
无标题文档 function myPrint(obj){ var newWindow=window.open("打印窗口","_blank"); var docStr = obj.innerHTML; newWindow.document.write(docStr); newWindow.document.close(); newWindow.print
JS打印指定区域内容
清水茶叶
09-29 267
来源：http://www.cnblogs.com/dudumao/archive/2012/10/04/2711571.html   很多时候，我们在做系统的时候要做打印功能，打印在js中其实很简单，不过这个很简单的代码并不能满足我们的特定需求，比如我们需要打印的表单在很多文字的中间，或者文字中包含一些广告或者图片什么的，这就很难用：window.print()；这时，我们就要分区域的打印...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值