采用printArea进行页面的打印功能实现。
printArea本身支持popup和iframe方式弹出打印机选择功能,在popup模式中,会弹出要打印的部分,可以算作是一种预览,本次实现的功能,主要是为了解决popup时,页面中不进行显示相关的元素(如果只是为了打印不显示,可采用css进行控制,@media设置)。
本次主要在printArea的源码中进行了部分改造,增加了一个设置参数(在defaults中增加noPrintCss : [""]),并在getFormData中进行了相关改造,主要是增加部分代码。在getFormData代码块中retrun copy之前增加如下代码:
var noPrintCss_ = settings.noPrintCss;
var divspan = $("div,span,button,input", copy);
$("div,span,button,input", ele).each(function( i ){
for ( var x = 0; x < noPrintCss_.length; x++ ){
if(divspan.eq(i).hasClass(noPrintCss_[x])){
divspan.eq(i).remove();
}
}
});
主要屏蔽div\span\button\input元素,其他需要的元素可进行增加,至此改造完成。
var options = { mode : mode, popClose : close, extraCss : extraCss, retainAttr : keepAttr, extraHead : headElements,noPrintCss:["dd"] };
$("#id").printArea( options );
其中
noPrintCss 可传入包含css class名字的数组。