js打印，其实是打印当前页面的内容，是调用 系统的js方法，来弹出 打印设置窗口，用法很简单。

window.print()就行，有的考虑到 浏览器兼容性问题，会用到document.execCommand("print")

function jsPrint(){

if (typeof (getBrowerType().ie) != "undefined") {//浏览器判断

                document.execCommand('print');//弹出打印设置窗口

            } else {

                window.print();//弹出打印设置窗口

            }

        });

        function getBrowerType() {

            var sysType = {};

            var ua = navigator.userAgent.toLowerCase();

            var matchs;

            (matchs = ua.match(/msie ([\d.]+)/)) ? sysType.ie = matchs[1] :

            (matchs = ua.match(/trident\/([\d.]+)/)) ? sysType.ie = matchs[1] :

            (matchs = ua.match(/firefox\/([\d.]+)/)) ? sysType.firefox = matchs[1] :

            (matchs = ua.match(/chrome\/([\d.]+)/)) ? sysType.chrome = matchs[1] :

            (matchs = ua.match(/opera.([\d.]+)/)) ? sysType.opera = matchs[1] :

            (matchs = ua.match(/version\/([\d.]+).*safari/)) ? sysType.safari = matchs[1] : 0;

            return sysType;

        }

以上 就能够 弹出打印窗口，实现打印。那么如何选择性的 打印页面里的内容呢？

答案是，给不打印的内容 加上一个不显示的样式

<style media="print">//注意  要设置media="print"，意思是在打印时变现的样式

 .noPrint{//样式名字 随便取，你看得懂就好了

    display:none;//设置为打印的时候不显示

}

</style>

<div class=".noPrint">

这些不显示,可以把打印按钮放在这里

<input type="button" value="打印" onclick="jsPrint()"/>

这样，在打印的时候，这个div里面的内容就不会显示了。可以给多个元素设置noPrint样式

</div>

以下来个完整的例子：

<html>

<head>

    <meta name="viewport" content="width=device-width" />

    <title>Index</title>

    <script src="~/js/jquery-ui-1.8.20.min.js"></script>

    <script type="text/javascript">

        function jsPrint() {

            if (typeof (getBrowerType().ie) != "undefined") {

                document.execCommand('print');

            } else {

                window.print();

            }

        }

        function getBrowerType() {

            var sysType = {};

            var ua = navigator.userAgent.toLowerCase();

            var matchs;

            (matchs = ua.match(/msie ([\d.]+)/)) ? sysType.ie = matchs[1] :

            (matchs = ua.match(/trident\/([\d.]+)/)) ? sysType.ie = matchs[1] :

            (matchs = ua.match(/firefox\/([\d.]+)/)) ? sysType.firefox = matchs[1] :

            (matchs = ua.match(/chrome\/([\d.]+)/)) ? sysType.chrome = matchs[1] :

            (matchs = ua.match(/opera.([\d.]+)/)) ? sysType.opera = matchs[1] :

            (matchs = ua.match(/version\/([\d.]+).*safari/)) ? sysType.safari = matchs[1] : 0;

            return sysType;

        }

    </script>

    <style media="print">

        .noPrint {

            display:none;

        }

    </style>

</head>

<body>

    <div>

        <table>

            <thead>

                <tr>

                    <th>星期一</th>

                    <th>星期二</th>

                    <th>星期三</th>

                    <th>星期五</th>

                </tr>

            </thead>

            <tr>

                <td>语文</td>

                <td>数学</td>

                <td>英语</td>

                <td>体育</td>

            </tr>

            <tr>

                <td>语文</td>

                <td>数学</td>

                <td>英语</td>

                <td>体育</td>

            </tr>

            <tr>

                <td>语文</td>

                <td>数学</td>

                <td>英语</td>

                <td>体育</td>

            </tr>

            <tr>

                <td>语文</td>

                <td>数学</td>

                <td>英语</td>

                <td>体育</td>

            </tr>

        </table>

    </div>

    <div class="noPrint" style="border:solid 2px green">xxxxxx这些东西不要打印

        <input class="noPrint" type="button" value="打印" onclick="jsPrint()" />

    </div>

</body>

</html>

js打印的更多相关文章

  1. js 打印

    关于js打印很简单的一段代码 function doPrint() { var newWindow = window.open("打印窗口", "_blank" ...

  2. js打印html中的内容

    js打印方法 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www. ...

  3. js打印Iframe中的内容，并且不需要预览。

    js打印Iframe中的内容,并且不需要预览 js代码如下: <script type="text/javascript" language="Javascript ...

  4. js打印保存用户输入的内容

    在用js打印局部页面时,遇到用户新输入的内容没能打印出来,经过观察,发现我采用的js打印方法是读取页面源代码,而用户输入的内容如果不将其写入到页面源代码中去,是打印不出来的,下面是我的解决方法: // ...

  5. 使用jquery.PrintArea.js打印网页的样式问题

    在使用jquery.PrintArea.js打印局部网页样式的时候,发现样式打印不出来,在网上找了好多资料,整理一下分享给大家 一.先看看css的引用文件方式 1.直接在内部的元素中使用”style” ...

  6. js打印页面指定区域，并去掉页眉上的时间和请求路径

    需要通过js打印指定页面的内容 <style media=print type="text/css"> .noprint{visibility:hidden} < ...

  7. 利用JS打印质数

    我爱撸码,撸码使我感到快乐!大家好,我是Counter,今天非常愉快,没有前几天的相对比较复杂的逻辑思维在里面,今天来写写,利用JS打印质数,基本上很多面试,会很经常的考到.那废话不多说,直接上代码: ...

  8. jquery.wordexport.js打印echarts.js画出的柱状图

    jquery.wordexport.js打印echarts.js画出的柱状图. echarts画出的图是不能直接打印出来的(echarts的柱状图是用canvas画出来的),而jquery.worde ...

  9. 使用lodop.js打印控件打印table并分页等

    import {getLodop} from '@/utils/LodopFuncs.js' //打印表格 export default{ // num 打印还是打印预览 conData 对象形式 传 ...

随机推荐

  1. JS使用合并数组

    var arr= [4,5,6]; var arr1 = [7,8,9]; var arr2=[1,2,3]; arr.concat(arr1,arr2); //或者使用Arry.prototype. ...

  2. php重定向页面的三种方式

    PHP页面跳转一.header()函数 header()函数是PHP中进行页面跳转的一种十分简单的方法.header()函数的主要功能是将HTTP协议标头(header)输出到浏览器. header( ...

  3. 解决gerber-Failed to Match All Shapes for PCB问题

    有效解决在Protel 99se导gerber时提示gerber-Failed to Match All Shapes for PCB出错问题如图 这种问题很好解决,打开这个窗口 操作方法如下图Emb ...

  4. js 选择器

    a>b  获取a下面的直接子元素

  5. Windows Phone 8初学者开发—第10部分：数据绑定应用程序和透视应用程序项目模板简介

    原文 Windows Phone 8初学者开发—第10部分:数据绑定应用程序和透视应用程序项目模板简介 原文地址: http://channel9.msdn.com/Series/Windows-Ph ...

  6. wiki oi3117 高精度练习之乘法

    题目描述 Description 给出两个正整数A和B,计算A*B的值.保证A和B的位数不超过500位. 输入描述 Input Description 读入两个用空格隔开的正整数 输出描述 Outpu ...

  7. 警告：‘xxxx’ 将随后被初始化

    关于编译报警告.本次是接手一个新手的代码,总共不到1K行的代码.两个类.编译的时候报的警告,本来也不打算管理这个事情的.要求也不会有那么严格.但上午看完代码后,觉得毕竟是新手写的代码,还是有很多需要修 ...

  8. layer 的常用属性

    layer的各种属性代码示例: - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading ...

  9. CoreAnimation (CALayer 动画)

    CoreAnimation基本介绍: CoreAnimation动画位于iOS框架的Media层 CoreAnimation动画实现需要添加QuartzCore.Framework CoreAnima ...

  10.  D - 粉碎叛乱F - 其他起义

    D - 粉碎叛乱 Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I64u Submit Sta ...