打印web页面指定区域的三种方法

时间:2022-09-05 18:54:42

本文和大家分享一下web页面实现指定区域打印功能的三种方法,一起来看下吧。

  第一种方法:使用CSS

  定义一 个.noprint的class,将不打印的内容放入这个class内。

  代码如下:

<style media="print" type="text/css"> 
.noprint{visibility:hidden} 
</style>
这 里是要打印的内容。
<p class="noprint">这里是不打印的内容。</p>
<a href="javascrīpt:window.print()" target="_self"& gt;打印</a>

  第二种方法:指定打印区域

   把要打印的内容放入一个span或div,然后通过一个函数打印。

  代码如下:

<span id="div1">这里是要打印的内容</span& gt;
<p>所有内容</p>
<div id="div2">div2的内容</div& gt;
<a href="javascrīpt:printme()" target="_self">打印</a>
<script language="javascript">
function printme(){
 document.body.innerHTML=document.getElementById('div1').innerHTML+'<br/>'+document.getElementById('div2').innerHTML;
 window.print();
}
</script>

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

  第三种方法:如果要打印的页面排版和原web页面相差很大,采用此种 方法。

  点击打印按钮弹出新窗口,把需要打印的内容显示到新窗口中,在新窗口中调用window.print()方法,然后自动关闭新 窗口。

网页设计----打印网页指定区域

<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();
window.document.body.innerHTML=bdhtml;
}
</script> <!--startprint-->在需要打印的内容<!--endprint--> <input type="button" onClick="doPrint()" value="打印" /> // 页面上的内容大小调整可以css调整或容器包容 打印容器内的内容就可以了

打印web页面指定区域的三种方法的更多相关文章

  1. php 伪造HTTP&lowbar;REFERER页面URL来源的三种方法

    php获取当前页面的前一个页面URL地址,即当前页面是从哪个页面链接过来的,可以使用$_SERVER['HTTP_REFERER']; 但是$_SERVER['HTTP_REFERER']也是可以被伪 ...

  2. ASP&period;NET页面跳转的三种方法比较

    在ASP.NET下,经常需要在页面之间跳转,下面我们来分别介绍一下关于.NET中Response.Redirect(),Sever.Execute(),Server.Transfer() 三种页面跳转 ...

  3. web页面实现文件下载的几种方法

    今天碰到文件下载的一些问题,本着知其然也要知其所以然的精神,站在巨人的肩膀上深入学习和测试了一下,抛砖引玉,现在总结结论如下: 1)标准URL下载方式可以通过在web页面中嵌入 url超级链接,标准的 ...

  4. Jquery 页面初始化常用的三种方法以及Jquery 发送ajax 请求

    第一种 $(document).ready(function(){ //文档就绪事件 }); 第二种是第一种的简略写法,效果上和第一种是等效的. $(function(){ //文档加载事件,整个文档 ...

  5. ionic2 中隐藏子页面tabs选项卡的三种方法

    第一种: 隐藏全部子页面的tabs选项界面 找到app.module.ts文件 ,修改如下代码 imports: [ IonicModule.forRoot(MyApp,{ tabsHideOnSub ...

  6. js灵活打印web页面区域内容的通用方法

      我们做网站,经常需要打印页面指定区域的内容,而网上关于这块的说法很多,各种各样的打印控件也不少.但许多打印方案都不怎么好,至少我不喜欢,要么封装复杂,要么难以维护.正好现在的项目也需要用到 ...

  7. js打印WEB页面内容代码大全

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

  8. YbSoftwareFactory 代码生成插件【二十五】:Razor视图中以全局方式调用后台方法输出页面代码的三种方法

    上一篇介绍了 MVC中实现动态自定义路由 的实现,本篇将介绍Razor视图中以全局方式调用后台方法输出页面代码的三种方法. 框架最新的升级实现了一个页面部件功能,其实就是通过后台方法查询数据库内容,把 ...

  9. IDEA&plus;Maven&plus;Tomcat构建Web项目的三种方法

    [本文版权归微信公众号"代码艺术"(ID:onblog)所有,若是转载请务必保留本段原创声明,违者必究.若是文章有不足之处,欢迎关注微信公众号私信与我进行交流!] 本文将介绍三种方 ...

随机推荐

  1. python调用其他程序或脚本方法(转)

    python运行(调用)其他程序或脚本 在Python中可以方便地使用os模块运行其他的脚本或者程序,这样就可以在脚本中直接使用其他脚本,或者程序提供的功能,而不必再次编写实现该功能的代码.为了更好地 ...

  2. Net分布式系统之三:Keepalived&plus;LVS&plus;Nginx负载均衡之高可用

    上一篇写了nginx负载均衡,此篇实现高可用(HA).系统整体设计是采用Nginx做负载均衡,若出现Nginx单机故障,则导致整个系统无法正常运行.针对系统架构设计的高可用要求,我们需要解决Nginx ...

  3. 第十二章 redis-cluster搭建(redis-3&period;2&period;5)

    redis集群技术 redis2.x使用客户端分片技术 redis3.x使用cluster集群技术 一.环境 os:centos7 ip:10.211.55.4 redis:3.2.5 gem-red ...

  4. ps去水印

    使用仿制图章工具去除使用仿制图章工具去除文字这是比较常用的方法,具体的操作是,选取仿制图章工具,按住Alt键,在无文字区域点击相似的色彩名图案采样,然后在文字区域拖动鼠标复制以覆盖文字.要注意的是,采 ...

  5. mysql语句 索引操作

    创建索引:(help create index;) CREATE INDEX indexName ON tableName(Coll,Coll....); ALTER TABLE tableName ...

  6. 能量项链&sol;&sol;区间DP

    P1056 能量项链 时间: 1000ms / 空间: 131072KiB / Java类名: Main 背景 NOIP2006 提高组 第一道 描述     在Mars星球上,每个Mars人都随身佩 ...

  7. python--对于装饰器的理解

    1.首先,有个原来写好的函数,完成一定的功能,比如下面的,就打印一句话(某程序被调用).简单点,容易帮我们想清楚程序是怎么执行的. ''' 原函数 ''' def fun1(): print(&quo ...

  8. Asp&period;net mvc 中Action 方法的执行&lpar;三&rpar;

    [toc] 前面介绍了 Action 方法执行过程中的一些主要的组件以及方法执行过程中需要的参数的源数据的提供以及参数的绑定,那些都可以看作是 Action 方法执行前的一些必要的准备工作,接下来便将 ...

  9. Android 画文字图

    画图 private Bitmap getbitmap(String content) { Bitmap bitmap = Bitmap.createBitmap(400, 400, Bitmap.C ...

  10. javascript 4&period;2

    element.value="......"也可以为属性设置新的值 setAttribute()方法是“第一级DOM”的组成部分之一,DOM是适用于多种环境和多种程序设计语言的通用 ...