<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>DIV打印Demo</title>
<!--jqueryCDN-->
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
</head>
<body>
<div id="printdiv">
<div style="text-align: center;">
<h3>沁园春·雪</h3>
<p>北国风光,千里冰封,万里雪飘。</p>
<p>望长城内外,惟余莽莽;大河上下,顿失滔滔。</p>
<p>山舞银蛇,原驰蜡象,欲与天公试比高。</p>
<p>须晴日,看红装素裹,分外妖娆。</p>
<p>江山如此多娇,引无数英雄竞折腰。</p>
<p>惜秦皇汉武,略输文采;唐宗宋祖,稍逊风骚。</p>
<p>一代天骄,成吉思汗,只识弯弓射大雕。</p>
<p>俱往矣,数风流人物,还看今朝。</p>
</div>
</div>
<button id="print">打印</button>
<div style="text-align: center;">
<p>这是一段废话不打印,hahahahahaahahahahahahahahahahahahaha</p>
</div>
</body>
<script>
$("#print").click(function(){
var frame1=$('<iframe />');
frame1[0].name="frame1";
//隐藏构造的iframe
frame1.css({ "display": "none" });
$("body").append(frame1);
var frameDoc = frame1[0].contentWindow ? frame1[0].contentWindow :
frame1[0].contentDocument.document ? frame1[0].contentDocument.document : frame1[0].contentDocument;
frameDoc.document.open();
frameDoc.document.write('<html><head>');
frameDoc.document.write('<title>沁园春·雪</title>');
frameDoc.document.write('</head><body>');
frameDoc.document.write($("#printdiv").html());
frameDoc.document.write('</body></html>');
frameDoc.document.close(); window.frames["frame1"].focus();
window.frames["frame1"].print();
frame1.remove();
})
</script>
</html>

网页中Div的打印的更多相关文章

  1. php部分:网页中报表的打印,并用CSS样式控制打印的部分;

    网页中报表的打印,是通过调用window对象中的print()方法实现打印功能的: 调用浏览器本身的打印功能实现打印 <a href="#" onclick="wi ...

  2. 隐藏网页中DIV和DOM的各种方法

    记录一下各种隐藏html元素的方法 <!DOCTYPE html> <html> <head> <title></title> <me ...

  3. 网页中如何用 CSS 设置打印分页符

    Word 中按 Ctrl + Enter 创建一个分页符,方便打印,其实网页中也可以,用 CSS 的 page-break-after:always;. <p>第 1 页</p> ...

  4. 网页制作过程中div定位的三个问题

    这几天要做单位的网站,对于做网站我也不怎么样,于是我便在网上参考了一个比较满意的网站,套一下来把这个工作结束了.在此期间遇到了三个关于div定位问题, 一般网站用div布局时都是从上到下分head . ...

  5. IE8下网页中的视频会遮挡住顶层DIV的解决办法

    在IE8浏览器下,发现网页中的视频会遮挡住本来固定在最顶层的DIV.即便使用z-index也无法解决.但是其他浏览器是正常的. 解决的办法很简单,就是在调用flash视频播放器的时候,加上一个参数“o ...

  6. CAD在网页中如何实现嵌套打印?

    当用户需要打印两个控件的图纸时,可以采用嵌套打印实现.点击此处在线演示. 实现嵌套打印功能,首先将两个控件放入网页中,js代码如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 ...

  7. 如何把报表放到网页中显示(Web页面与报表简单集成例子)

    1.问题描述 现在用户开发的系统基本上趋向于BS架构的浏览器/服务器模式,这些系统可能由不同的语言开发,如HTML.ASP.JSP.PHP等,因此需要将制作好的报表嵌入到这些页面中. FineRepo ...

  8. 怎样把报表放到网页中显示(Web页面与报表简单集成样例)

    1.问题描写叙述 如今用户开发的系统基本上趋向于BS架构的浏览器/server模式.这些系统可能由不同的语言开发.如HTML.ASP.JSP.PHP等.因此须要将制作好的报表嵌入到这些页面中. Fin ...

  9. 前端开发css实战:使用css制作网页中的多级菜单

    前端开发css实战:使用css制作网页中的多级菜单 在日常工作中,大家都会遇到一些显示隐藏类菜单,比如页头导航.二维码显示隐藏.文本提示等等......而这些效果都是可以使用纯css实现的(而且非常简 ...

随机推荐

  1. 记账本微信小程序开发三

    一.制作登陆界面: 更改全局配置,改颜色,名称: 界面 格式 登录界面 二.页面的跳转 按钮的设置 注册事件 结果

  2. 怎样从外网访问内网Jupyter Notebook?

    本地安装了一个Jupyter Notebook,只能在局域网内访问,怎样从外网也能访问到本地的Jupyter Notebook呢?本文将介绍具体的实现步骤. 准备工作 安装并启动Jupyter Not ...

  3. Servlet上传下载

    下面是一个jsp页面(method和enctype必须要有) //页面<form action="file?file=upLoadByjs" method="pos ...

  4. Doing Homework HDU - 1074

    Ignatius has just come back school from the 30th ACM/ICPC. Now he has a lot of homework to do. Every ...

  5. Golang实现冒泡排序法

    关于冒泡排序的原理请看本博客这篇文章冒泡排序法原理讲解及PHP代码示例 //代码 package main import ( "fmt" ) func main() { //定义一 ...

  6. 如何通过 Vue+Webpack 来做通用的前端组件化架构设计

    目录:   1. 架构选型     2. 架构目录介绍     3. 架构说明     4. 招聘消息 目前如果要说比较流行的前端架构哪家强,屈指可数:reactjs.angularjs.emberj ...

  7. Kali系列之Hydra/Medusa mysql密码爆破

    hydra hydra -L /home/chenglee/zidian/user.txt -P /home/chenglee/zidian/wordlist.TXT 192.168.137.133 ...

  8. html5-表单属性及<!DOCTYPE> 标签

    <!DOCTYPE> 标签定义和用法<!DOCTYPE> 声明必须位于HTML 5 文档中的第一行,也就是位于<html> 标签之前.该标签告知浏览器文档所使用的H ...

  9. 在用网站ICP备案主体变更导致网站无法访问问题解决

    关于ICP备案: 备案的目的:是为了防止在网上从事非法的网站经营活动,打击不良互联网信息的传播,如果网站不备案的话,很有可能被查处以后关停.非经营性网站自主备案是不收任何手续费的,所以建议大家可以自行 ...

  10. Java基础语法(下)

    1.数组动态初始化 //数据类型[] 数组名 = new 数据类型[数组长度]; int[] arr = new int[3]; /* * 左边: * int:说明数组中的元素类型是int类型 * [ ...