第一种方法:指定不打印区域
使用CSS,定义一个.noprint的class,将不打印的内容放入这个class内。
细如下:

?
1
2
3
<style media=print type="text/css">
.noprint{visibility:hidden}
</style>

要打印的内容。哈哈!

?
1
2
<p class="noprint">将不打印的代码放在这里。</p>
<a href="javascript:window.print()" rel="external nofollow" target="_self">打印</a>

第二种方法:指定打印区域
把要打印的内容放入一个 span或div,然后通过一个函数打印。

?
1
2
3
4
5
6
7
8
9
10
<span id='div1'>把要打印的内容放这里</span>
<p>所有内容</p>
<div id="div2">div2的内容</div>
<a href="javascript:printme()" rel="external nofollow" target="_self">打印</a>
<script language="javascript">
function printme()
{ document.body.innerHTML=document.getElementByIdx_x_x('div1').innerHTML+'<br/>'+document.getElementByIdx_x_x('div2').innerHTML;
window.print();
}
</script>

如果要打印的只是整个页面中的一小部分,就最好采用第二种方法。

第三种方法:如果要打印的页面排版和原web页面相差很大,采用此种方法。点打印按钮弹出新窗口,把需要打印的内容显示到新窗口中,在新窗口中调用window.print()方法,然后自动关闭新窗口。
window.print可以打印网页,但有时候我们只希望打印特定控件或内容,怎么办呢?

首先我们可以把要打印的内容放在div中,然后用下面的代码进行打印。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
<html>
<head>
<script language="javascript">
function printdiv(printpage)
{
var headstr = "<html><head><title></title></head><body>";
var footstr = "</body>";
var newstr = document.all.item(printpage).innerHTML;
var oldstr = document.body.innerHTML;
document.body.innerHTML = headstr+newstr+footstr;
window.print();
document.body.innerHTML = oldstr;
return false;
}
</script>
<title>div print</title>
</head>
<body>
//HTML Page
//Other content you wouldn't like to print
<input name="b_print" type="button" class="ipt" onClick="printdiv('div_print');" value=" Print ">
<div id="div_print">
<h1 style="Color:Red">The Div content which you want to print</h1>
</div>
//Other content you wouldn't like to print
//Other content you wouldn't like to print
</body>
</html>

指定window.print 打印区域相关推荐

  1. window.print()打印网页局部内容

    用window.print()打印网页局部内容 今天客户让添加个打印证照功能,直接用window.print()打印的是整个页面,而用以下方法就可以只打印证明了 <!--window.print ...

  2. 使用window.print()打印局部页面,ifrme打印ie报错

    问题: 使用window.print();打印页面,将不需要的数据隐藏,将需要的数据显示,打印完成之后将刚才隐藏的数据还原,显示的数据隐藏, 谷歌浏览器.部分ie能一气呵成,  火狐浏览器以及少数ie ...

  3. window.print打印部分无法显示

    1.window.print单选框无法显示 $("body").attr("style","-webkit-print-color-adjust: e ...

  4. 关于window.print打印分页功能

    平常window.print分页一般打印时用到page-break-after:always; 打印的样式设置在 <style type="text/css" media=& ...

  5. js的window.print()打印背景图片,打印背景图片无法显示

    js的window.print()打印背景图片 题目描述 js的window,print()打印背景图片给body加了图片地址之后,非要设置浏览器打印选项里面设置背景图形打印才行,怎么通过js去设置默 ...

  6. js window.print() 打印图片,图片有时候不显示

    window.print() 打印网络资源图片不显示 解决方法 等待网络资源图片加载完成后,在打印 $(doc).find('.qrcode-down').load(function () {ifra ...

  7. page-break-after:always;解决window.print打印断页问题——已解决

    今天用户提出一个关于window.print()打印的问题: 如下图所示:在打印断页的部分,会出现数据打印不全的情况.打印预览与实际打印的情况还有有所区别. 注意一点:如果想要实现window.pri ...

  8. window.print打印指定div-打印网页指定区域

    第一种方法:指定不打印区域 使用CSS,定义一个.noprint的class,将不打印的内容放入这个class内. 细如下: <style media=print type="text ...

  9. window.print 打印页面指定区域

    这一阵子由于项目需要,需要在项目某页面下加一个打印的功能,在网上查过之后,知道了window.print 这个函数,这个函数可以很方便的打印当前窗口中的内容, 但是这个有时候并不能满足广大用户的需求: ...

最新文章

  1. Asp.NetCore1.1版本没了project.json,这样来生成跨平台包
  2. SSH隧道 / SSH穿透
  3. 计算机网络:第六章 应用层
  4. Java Calendar 获取时间为明天的上午10点
  5. 机器学习A-Z~简单线性回归
  6. 2.vue 安装教程
  7. vmware centos 7 更新vmware-tools
  8. sulin Python3.6爬虫+Djiago2.0+Mysql --实例demo
  9. [MyBatisPlus]通用枚举
  10. 简单用于测试的listview的视图
  11. Hadoop和大数据:60款顶级大数据开源工具
  12. 2020switch电信最快的dns_《2020switch电信最快的dns》电影_2020switch电信最快的dns正片免费观看-深圳市创业发科技有限公司...
  13. 企业微信网页应用开发 - 权限验证
  14. 腾讯ISUX网页前端代码分析
  15. 【项目经验】产研流程(超级详细的步骤)
  16. matlab怎么表示x的平方,用matlab算多项式x平方
  17. 自定义监控项及告警升级
  18. Semantic UI 之 标签 label
  19. Theorem、Proposition、Lemma的区别
  20. 微软Office Powerpoint双击打不开后的修复办法

热门文章

  1. 人工蜂群算法python_人工蜂群算法简介与程序分析
  2. 经典算法题-球和篮子
  3. TTS实现文字语音朗读
  4. MOS管GS两端并联阻容的作用分析
  5. 阿里云HaaS100物联网开发板学习笔记(一)硬件资源介绍
  6. 谷歌翻译不能用的解决方案 (win和mac方案 12-17持续更新...)
  7. 推荐一个利用 python 生成 pptx 分析报告的工具包:reportgen
  8. 从几个动物故事告诉你如何做好团队管理
  9. Air724UG 4G LTE 模块AT指令连接服务器
  10. disable属性导致后台接收值为null解决方法