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. Java疯狂讲义（四）

  2. Identity-修改Error错误提示为中文

    第一步:重写IdentityErrorDescriber public class CustomIdentityErrorDescriber : IdentityErrorDescriber     ...

  3. 转:用JS判断IE浏览器的版本(-- 很巧妙实用的方法)

    ~~在看到这篇文章之前如果让我来判断IE的版本,那么我基本上会用 navigator.userAgent去做字符串检索,现在觉得特性检测的确比较靠谱一点 今天一个项目中需要判断IE版本号,又因为 jQ ...

  4. hibernate 数据关联一对多 3.1

    一对多,多对一 (在多的一端存放一的外键) 但是在实体类中不需要创建这个外键 // 在一的一方创建Set集合 public class User { private Integer id; priva ...

  5. 转： c++继承中的内存布局

    英文原文: http://www.openrce.org/articles/files/jangrayhood.pdf 翻译: http://blog.csdn.net/jiangyi711/arti ...

  6. BZOJ 1756: Vijos1083 小白逛公园

    题目 1756: Vijos1083 小白逛公园 Time Limit: 10 Sec  Memory Limit: 64 MBSubmit: 856  Solved: 264[Submit][Sta ...

  7. poj 3624 Charm Bracelet(区间dp)

    题目链接:http://poj.org/problem?id=3624 思路分析: 经典的0-1背包问题: 分析如下: 代码如下: #include <iostream> using na ...

  8. uva - The Lottery(容斥，好题)

    10325 - The Lottery The Sports Association of Bangladesh is in great problem with their latest lotte ...

  9. Java数据类型BooleanDemo

  10. B. Friends and Presents（Codeforces Round #275(div2)

    B. Friends and Presents time limit per test 1 second memory limit per test 256 megabytes input stand ...