首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

web页面的单打印以及批量打印实现方法

打印事件:window.print() 1.单打印(布局打印): function printCnt(){ //1.获取当前的html代码 var body = window.document.body.innerHTML...; //2.要打印的部分(#print里面的内容就是要打印的内容) window.document.body.innerHTML =document.getElementById(...window.document.body.innerHTML = body; //重新载入当前文档: location.reload(); } 注意:location.reload();要加,因可解决JS...window.print()第二次点击事件失效问题 2.批量打印 注意点: (1).控制网页的分页:page-break-after:always 注意:避免在表格、浮动元素、带有边框的块元素中使用分页属性...//如果是本地测试,需要先新建Print.html,如果是在域中使用,则不需要 // res 是后端返回的需要打印的xxx.html页面 var pwin=window.open(res,"print

4.5K00

JS 实现分页打印

在调用 window.print() 时,可以实现打印效果,但内容太多时要进行分页打印。...在样式中有规定几个打印的样式 page-break-before 和 page-break-after CSS属性并不会修改网页在屏幕上的显示,这两个属性是用来控制文件的打印方式。...page-break-before 若设定成 always,则是在遇到特定的组件时,打印机会重新开始一个新的打印。...page-break-before 若设定成left,则会插入分页符号,直到指定的组件出现在一个左边的空白上。...如果必要则在元素前插入分页符 always 在元素前插入分页符 avoid 避免在元素前插入分页符 left 在元素之前足够的分页符,一直到一张空白的左为止 right 在元素之前足够的分页符,一直到一张空白的右为止

13.8K21

js在控制台打印html页面,vue 使用print-js 打印html页面

Print.js 官网 官网 优点:可以打印多种格式的内容(pdf、json、html等) 打印json时可以添加表头。...打印html时可以继承原有页面的样式,局部打印,过滤掉要打印的元素,及其方便。...一、vue安装命令: npm install print-js –save 二、引入 这个引入不需要在main.js中,直接在使用的.vue中引入即可 这里颜色虽然是灰色,但是也要添加,否则会报错。...properties:是打印json时所需要的数据属性。 gridHeaderStyle和gridStyle都是打印json时可选的样式。...repeatTableHeader:在打印JSON数据时使用。设置为时false,数据表标题将仅在第一显示。 scanStyles:设置为false时,库将不处理应用于正在打印的html的样式。

8.3K30
领券