问题描述:

    JS实现Web打印,要求打印前一种样式,打印预览时新样式

问题解决:

        (1)设置打印时的css样式,设置打印前的css样式

注:

        以上为print.css打印时的css样式,其中display可以设置当前的css对象是否可见,设置上述css样式为打印时的样式:

如上所示,添加media="print",就可以设置此css样式文件为打印时可见。

注:

        以上为当前页面的样式,起初是隐藏的,在打印预览时,希望显示出来,打印时调用printview的css样式

注:

    如上所示的设置,对于id=“ordernum”的文本框存在两种样式,specialorder和printview样式,其中specialorder为当前页面的样式设置,而printview是打印预览的样式,这样就可以实现,当前页面的元素在打印预览时进行显示。

        (2)通过增加和删除css 类(class)来改变打印前后的样式

注:

        以上函数时设置打印预览页面的JS函数,其中包括打印预览前删除页面的css样式,使用打印的css样式,打印预览关闭之后,增加当前页面的css样式,隐藏print样式

注:

        以上JS函数时删除某个对象的css对象的函数

注:

        以上函数是增加某个对象的css样式

JS Web打印,实现预览新样式的更多相关文章

  1. JS页面打印,预览,设置,分页

    一)在HTML页中加载打印对象 <object id="WebBrowser" width="0" height="0" classi ...

  2. 使用pdf.js在移动端预览pdf文档

    pdf.js 是一个技术原型主要用于在 HTML5 平台上展示 PDF 文档,无需任何本地技术支持. 在线演示地址:http://mozilla.github.com/pdf.js/web/viewe ...

  3. 兼容好的JS图片上传预览代码

    转 : http://www.codefans.net/articles/1395.shtml 兼容好的JS图片上传预览代码 (谷歌,IE11) <html xmlns="http:/ ...

  4. PrintDocument打印、预览、打印机设置和打印属性的方法

    WindowsForm 使用 PrintDocument打印.预览.打印机设置和打印属性的方法. private void Form1_Load(object sender, System.Event ...

  5. JS实现的图片预览功能

    之前的博文有实现过图片上传预览,但那种方法是预览时就将图片上传,会产生很大的浪费空间.找到了之前有人写的用JS实现的图片预览,就说用js将上传的图片显示,上传代码在之前的博文中有写到. 以下是实现的代 ...

  6. 使用CAD快速看图如何将图纸打印和预览?

    有相关CAD工作经验的小伙伴们都知道,绘制完CAD图纸后是需要借助CAD看图工具来进行查看图纸的,其实CAD快速看图中不仅能够对图纸进行查看,还能够将CAD图纸进行打印出来.但是有很多的伙伴不知道要怎 ...

  7. JS打印、预览(IE,Chrome)

    IE下: 调用IE内置打印组件完成web打印方案.IE调用ActiveX实现打印. 重点: 注意: 1.CSS对打印的控制: .Noprint{display:none;} .PageNext{pag ...

  8. pdf.js实现图片在线预览

    项目需求 前段时间项目中遇到了一个模块,是关于在线预览word文档(PDF文件)的,所以,找了很多插件,例如,pdf.js,pdfobject.js框架,但是pdfobject.js框架对于IE浏览器 ...

  9. 尝鲜一试,Azure静态网站应用服务(Azure Static Web Apps) 免费预览,协同Github自动发布静态SPA

    背景 最近在浏览微软的文档的时候发现,微软喜欢用Hugo这个文档框架,有些技术产品的文档页面就用Hugo来做的,同时搭配Github + Azure Static Web Apps Service这个 ...

随机推荐

  1. JS 回车提交

    1.JavaScript 方法: <script> document.onkeydown=function(event){ e = event ? event :(window.event ...

  2. SQL 复制订阅 异常后 强制删除

    最近做数据库同步备份工作,将 主库 通过SQLService 自带的 [复制] 订阅出去后,因为 订阅方(从库) 发生异常,主库 无法确定 从库的订阅,就想清理了,订阅重新做同步,结果.....主库上 ...

  3. 2015影响因子Excel版

    现在终于有影响因子2015的Excel版了,这个版本除了还包括杂志全称和缩写等基本信息还,包括中科院分区, 应该是迄今2015影响因子最奢华的版本了吧. 看了这个版本,发现中国的SCI杂志还是不少的, ...

  4. 搭建Cocos Code IDE开发环境

    Cocos Code IDE是Cocos2d-x团队开发的,用于开发Cocos2d-JS和Cocos2d-x Lua绑定的游戏工具,它是基于Eclipse[ Eclipse 是一个开放源代码的.基于J ...

  5. Cocos2d-x文本菜单

    文本菜单是菜单项只是显示文本,文本菜单类包括了MenuItemLabel.MenuItemFont和MenuItemAtlasFont.MenuItemLabel是个抽象类,具体使用的时候是使用Men ...

  6. UI2_视图切换

    // // ViewController.m // UI2_视图切换 // // Created by zhangxueming on 15/7/1. // Copyright (c) 2015年 z ...

  7. Java Executors(线程池)

    Sun在Java5中,对Java线程的类库做了大量的扩展,其中线程池就是Java5的新特征之一,除了线程池之外,还有很多多线程相关的内容,为多线程的编程带来了极大便利.为了编写高效稳定可靠的多线程程序 ...

  8. 19款绚丽实用的jQuery/CSS3侧边栏菜单

    jQuery作为一款主流的JavaScript前端开发框架,深受广告开发者的亲睐,同时jQuery有着不计其数的插件,特别是菜单插件更为丰富,本文将要为大家介绍20个绚丽而实用的jQuery侧边栏菜单 ...

  9. android 网络_网络源码查看器

    xml设计 <?xml version="1.0"?> -<LinearLayout tools:context=".MainActivity" ...

  10. 用户输入内容转换成Pig Latin形式。

    //(单词的第一个元音字母之前的一道单词后面,以"ay"结尾,英语单词首字母为元音字母或者没有元音字母的以“ay”为后缀.)package toPigLatin; import j ...