Window.print()方法用于在浏览器中打印当前窗口的内容,如果想要打印当前窗口中指定部分的内容的话需要其他的一些特殊的处理;

Demo:

  <html>

    <head>

      <title>页面标题</title>

      <style type=”text/css” media=”print”>

        #button{ //隐藏网页中的打印按钮

          display:none;

        }

      </style>

      <script type=”javscript”>

        function qrprint(){

          Window.print(); //打印当前页面

          Window.close(); //关闭当前页面

        }

      </script>

    </head>

    <body>

      <button id=”button” onclick="qrprint();">打印</button>

      <table  id=”tab_1”>

        <tr>

          <td><img src=”” title=””/></td>

          <td><img src=”” title=””/></td>

          <td><img src=”” title=””/></td>

        </tr>

        <tr>

          <td><img src=”” title=””/></td>

          <td><img src=”” title=””/></td>

          <td><img src=”” title=””/></td>

        </tr>

      </table>

      <table  id=”tab_2”>

        <tr>

          <td><img src=”” title=””/></td>

          <td><img src=”” title=””/></td>

          <td><img src=”” title=””/></td>

        </tr>

        <tr>

          <td><img src=”” title=””/></td>

          <td><img src=”” title=””/></td>

          <td><img src=”” title=””/></td>

        </tr>

      </table>

    </body>

  </html>

注意:

  点击打印按钮之后调用qrprint方法打印当前页面,然后呢在CSS 中#button {  display:none;  }的作用是在打印时隐藏button按钮, 否则的话会在打印时将打印按钮同时打印出来(在购物网站上的 打印订单可以查看到这一部分的前台代码);还有一个值得注意的 是浏览器在打印的时候会有页眉和页脚,这个在浏览器中是可以设置的;

IE浏览器:

  IE浏览器在第一次进行打印的时候需要进行设置:

    

  在如图所示的地方进行打印设置,点击打开页面设置,如图:

    

 需要在这一步勾选上”打印背景颜色和图像”,否则的话打印图片时会打印出一个叉号或者是空白,其他浏览器无需进行此项设置

页面尺寸设置:

  在特定情况下我们要打印的东西一般会要求适应指定的纸张大小,例如A4纸的尺寸或者是A3等,这个时候需要对table表格进行设置,规定每一个table表格的像素以保证打印出来的效果不会出现一张图片被两张纸割裂的情况.像素设置参考网页:http://www.doc88.com/p-7854217363912.html

使用window.print实现网页打印的更多相关文章

  1. 在网页上打印,js window.print

    window.print默认会打印出当前页在屏幕中显示的部分,可以实现在线打印

  2. 控制页面打印的2种方法(css3的media媒体查询和window.print())

    在实际开发中,有时可能会有打印的需求.下面我总结了2种打印的方法,希望对各位小伙伴有所帮助. ①:直接用window.print()方法就可以打印整个页面,下面是一个小demo <!DOCTYP ...

  3. window.print控制打印样式

    我们可能会去使用window.print()方法来打印页面,但是当我们遇到需要改变打印时候的字体大小等css样式的时候你可能会懵逼. 所以搜索成了我们的必经之路,我相信在网上搜索出来的最好的答案就是使 ...

  4. js实现网页打印分页打印

    web打印思路:html页面本身带有打印功能window.print() 但是在打印时又不能word模板的要求来打印不能满足打印需求.同时我们打印的数据有时候是动态变化的需要按模板来打印我的处理方式是 ...

  5. JS 网页打印解决方案

    这些日子真是太忙了,项目太多了公司总是加班,而且这些项目中好多都用到的打印,所以学习了一段时间js的打印. 其实原来只是用到了简单的功能,现在要深入的了解才发现原来ie的网页打印也是如此的强大. 以下 ...

  6. javascript实现的网页打印

    打印全部页面: <body onload="javascript:window.print()"> 实现局部打印,可以将不参加打印的元素设置“display=none” ...

  7. 使用window.print()后,未关闭打印页面,原网页不能操作

    使用window.print()后,未关闭打印页面,原网页不能操作,此时可以试着用window.location.reload()重新加载页面解决问题.

  8. window.print()打印网页(一)

    有时候需要将网页内容打印到纸上,最简单的一种方法是用window对象的print方法. window.print()默认打印当前网页的所有部分.(除了背景,默认打印都是白底黑字,如果有特别的设置 要另 ...

  9. 用window.print()打印指定div里面的内容(转载的)

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

随机推荐

  1. SynchronousQueue 的简单应用

    SynchronousQueue是这样一种阻塞队列,其中每个 put 必须等待一个 take,反之亦然.同步队列没有任何内部容量,甚至连一个队列的容量都没有.      不能在同步队列上进行 peek ...

  2. HTML页面主体常用设置

    1.定义网页背景颜色:<body bgcolor="red"> <body bgcolor="#0fc"> 2.设置背景图片: < ...

  3. 录制简单的自动化测试工具SlikMobile初体验

    今天朋友推荐了款自动化测试工具SlikMobile,下载了个试用了下,感觉还是很容易入门和上手的,感觉和testin的工具差不多,跨平台,多语言支持,支持图片.文本和Native Class三种对象方 ...

  4. Qunie问题

    Quine 以哲学家 Willard van Orman Quine (1908-2000) 而命名,表示一个可以生成他自己的完全的源代码的程序.编写出某个语言中最简短的 quine 通常作为黑客们的 ...

  5. LeetCode Alien Dictionary

    原题链接在这里:https://leetcode.com/problems/alien-dictionary/ 题目: There is a new alien language which uses ...

  6. Android中取消GridView & ListView默认的点击背景色

    方法一: gridView.setSelector(new ColorDrawable(Color.TRANSPARENT)); listView.setSelector(new ColorDrawa ...

  7. Linux环境下apache性能测试工具ab使用详解

    网站性能压力测试是服务器网站性能调优过程中必不可缺少的一环.只有让服务器处在高压情况下,才能真正体现出软件.硬件等各种设置不当所暴露出的问题. 性能测试工具目前最常见的有以下几种:ab.http_lo ...

  8. Struts(七):action配置文件之通配符映射

    通配符映射:一个Web应用可能有成百上千个action声明,可以使用struts提供的通配符映射机制把多个彼此相似的映射关系简化为一个映射关系. 通配符映射规则: 若找到多个匹配,没有通配符的那个将胜 ...

  9. Python 字符串方法详解

    Python 字符串方法详解 本文最初发表于赖勇浩(恋花蝶)的博客(http://blog.csdn.net/lanphaday),如蒙转载,敬请保留全文完整,切勿去除本声明和作者信息.        ...

  10. Js拼Json对象

     我们通常会拼字符串,但是拼字符串的话,遇见占位符会出错.  下面分享一个拼js拼json对象的方法:          var jsonArr = [];                     $ ...