js实现页面打印及bugger

1、由来

在项目需求中，有需要实现的打印当前页面的方法，问题是：当鼠标右键打印时，由于多页面组合，导致页面重叠打印，很显然不符合要求。故多方查找找到如下方法，仅供参考。

2、方法

2.1、jsp页面中处理

在jsp页面中添加打印按钮，并填充单机时间：打印

<button type="button" onclick="javascript:window.print();" class="btn">打印</button>

2.2、js文件中添加方法

依然是上面的按钮，只是点击事件在js页面中
下面这个方法，需要支持标签<//iframe>？
在jsp页面上需要添加第一行的代码

<iframe id="piframe" style="display:none"></iframe>function print(){
var pHTML = $("#divID").html;
var piframe=$("#piframe")[0];
var pwindow = piframe.contentWindow;
pwindow.document.close();
pwindow.document.write(pHTML);
pwindow.print():
}

另外一个方法更上一个相似，只是更通用一些

var pHTML=document.getElementById("divID").innerHTML;
var wind = window.open("","newwindow","height=1000,width=200,top=100,left=100.toobar=no,menubar=no,menubar=no,scrollbars=yes,resizable=yes,location=no,status=yes");
wind.document.title='打印预览';
wind.document.body.innerHTML=pHTML;
wind.print();

3、此次遇到的最大的也是最坑的问题

我们是从PDF文件中取得数据框架，然后根据页面输入填充数据，最后生成一个HTML文件。
以上三种方法，经过测试都能从HTML文件中取到数据，但当走到打印预览页面，就是空白纸，这问题一度使我怀疑人生。
一次偶然的机会同事（感谢同事）看了一眼我从HTML中获取的数据，然后告诉我由于数据中的一行配置，导致我无法从打印中获取数据。

@media print{body{display:none}}

这是在生成HTML文件时添加的，目的是拒绝打印，来达到保密的效果，这对我来说简直了。。。

js实现页面打印及bugger相关推荐

JS怎么实现页面打印 JS实现页面打印的方法
JS实现页面打印 1.js实现(可实现局部打印) [html] <input id="btnPrint" type="button" value=&quo ...
js使用页面打印window.print() 记录，并进行缩放打印
//打印print:function(){//获取打印的页面内容let subOutputRankPrint = document.getElementById('print-div');let ne ...
html打印页面设置缩放,js使用页面打印window.print() 记录，并进行缩放打印
//打印 print:function(){ //获取打印的页面内容 let subOutputRankPrint = document.getElementById('print-div'); le ...
用js实现页面打印以及自定义打印内容
实现一: <input type="button" value="打印" onClick="document.execCommand('prin ...
JS实现页面打印，控制打印时显示隐藏
点击打印调出打印预览,并实现只显示打印区域div. 实现效果实现代码 <!DOCTYPE html> <html lang="en"> <head& ...
js 在页面打印九九乘法表
for(var i=1;i<=9;i++){ for(var j=1;j<=i;j++){ document.write(i) document.write('×') document.w ...
HTML页面打印功能js代码,JavaScript_js实现页面打印功能实例代码(附去页眉页脚功能代码)，复制代码代码如下: html - phpStudy...
js实现页面打印功能实例代码(附去页眉页脚功能代码) 复制代码代码如下: @media print{ .print {display:block;} .notPrint {display:none; ...
页面打印插件 jquery.jqprint.js 插件使用实例
页面打印插件 jquery.jqprint.js 插件使用实例 jquery.jqprint.js 插件下载 jqprint 是一个基于jQuery编写的页面打印的一个小插件,可以对页面指定元素的内容 ...
js 页面打印，兼容单个打印和分页批量打印，自定义页眉和简单页脚
场景: 最近在公司做开发,有个需求需要页面打印功能,作为前端半桶水都不到,只会改页面的我,一脸懵逼,公司里也没人系统的做过,按照惯例,本着有事找度娘的心态(我一直认为我们现在遇到的70%-80%的问题 ...
php怎么实现打印预览,JavaScript_js实现局部页面打印预览原理及示例代码，最近有朋友问js 如何打印预览 - phpStudy...
js实现局部页面打印预览原理及示例代码最近有朋友问js 如何打印预览,今天就来讲解一下,首先了解一下打印原理,其实局部打印页面很简单.就是把你需要打印的部分做一个起始标记,至于标记如何写,随便你写什 ...