錯誤的寫法:
//view code列印function
printpage(areaid)
var prinframe = parent.$("#prinframe")[0];
$(prinframe).contents().find("body").html($("#" +areaid).html());
var win =prinframe.contentwindow;
win.document.execcommand('print');
}
錯誤原因:只把列印區域的內容放到iframe中,樣式資訊丟了。
改進後的寫法:
//view code列印function
printpage(areaid)
var prinframe = parent.$("#prinframe")[0];
var win =prinframe.contentwindow;
$(prinframe).attr("src", window.location.href);
$(prinframe).load(
function
() );
}
上面寫法的缺點:多次點選列印按鈕,iframe的load事件會被繫結多次;列印區域的大小超出a4紙範圍;
再次改進後的寫法:
//view code列印function
printpage(areaid) , 100);
});}
else
$(prinframe).attr("src", window.location.href);
}
再次改進後,確保iframe的load事件只被繫結一次;用寬度為970的table限制列印區域大小。
上面的寫法還是有錯誤,重新開啟tab頁時,點選列印,不再進入iframe的load方法,再修改:
//view code列印function
printpage(areaid)
parent.$("#prinframe").attr("src", window.location.href);
parent.$("#prinframe").one("load", function
() , 100);
});}
弄了一天,分頁列印的時候還是有問題,如下圖:
關於js方法列印指定區域
最近測試目前系統關於ie11的相容性問題,發現以前的列印頁面無法使用了,js報錯?比較奇怪的事情,於是除錯發現呼叫的公共方法 有問題。js中,列印頁面有window.print 方法,也有document.execcommand print 物件解析方式,還有webbrowser控制項方式來實現,但...
指令碼列印頁面指定區域內容
1 思路,獲取指定區域的html元素,放到新頁面中,然後列印 還有一種是在html頁面中做標識,該方法適用與能控制頁面元素的情況下 2 如下 3 var newwindow window.open 組織結構圖列印視窗 blank var str document.getelementbyid svg...
列印web頁面指定區域的三種方法
本文和大家分享一下web頁面實現指定區域列印功能的三種方法,一起來看下吧。第一種方法 使用css 定義一 個.noprint的class,將不列印的內容放入這個class內。如下 這 裡是要列印的內容。這裡是不列印的內容。第二種方法 指定列印區域 把要列印的內容放入乙個span或div,然後通過乙個...