最近测试目前系统关于ie11的兼容性问题,发现以前的打印页面无法使用了,js报错?比较奇怪的事情,于是调试发现调用的公共方法代码有问题。
js中,打印页面有window.print()方法,也有document.execCommand('print')对象解析方式,还有WebBrowser控件方式来实现,但公共方法中却是obj.document.execCommand('print',false),让我一直以为这种方法可以打印指定标签对象,但IE11的报错使得我明白了,这样写是有问题的,只是IE以前的版本中的解析器将这种错误忽略了,而且这样的写法也是打印整个页面(因为是打开了一个新页面然后将需要打印的对象添加到新页面中,而造成了自己认为是打印指定对象的错觉)。为此,我需要重新找到实现方法打印指定区域。
1、当前页打印
function printObj(obj) {
var newStr = obj.outerHTML;
var oldStr = document.body.innerHTML;
document.body.innerHTML = newStr;
window.print();
document.body.innerHTML = oldStr;
return false;
}
这中方式是将当前页替换为打印页,打印完之后再替换回来,打印之前可以对打印页进行特殊操作,例如去掉表格中的页码等。这种方法貌似只能打印某一对象?想要打印任意区域,通过对oldStr进行截取与拼接,也是可以实现任意区域打印的。
2、新窗口打印
function printObj(obj) {
var headStr = "<html><head><title></title></head><body>";
var footStr = "</body>";
var newStr = obj.outerHTML;
var newWindow=window.open("","_blank","k");
newWindow.document.write(headStr+newStr+footStr);
newWindow.print();
newWindow.close();
return false;
}
当然,也可以请求一个存在的新页面,然后在新页面中处理
//父页面
function openPrintHtml() {
document.form.target = '_blank';
document.form.submit();
}
//子页面
function printObj(objName) {
var obj = window.opener.document.getElementById(objName);
document.body.appendChild(obj);
window.print();
}
这样做的好处在于,你可以对打印的内容重定义样式等。