實作web列印的各種方法介紹及實作程式碼_javascript技巧

wed的列印方法具我自己懂得知道的有：
1、JQuery外掛Jqprint實作
2、JQery列印外掛PrintArea實作網頁列印
3、CSS控制網頁列印樣式

JQuery插件Jqprint實作：
首先要導入js檔：
jquery.jqprint.js下載

複製程式碼

複製程式碼

複製程式碼

複製程式碼

複製程式碼複製程式碼

複製程式碼>
程式碼如下:

html代碼：

複製代碼 程式碼如下:

這個列印時是顯示的

這個印刷時是隱藏的。




javascript程式碼

： 複製程式碼

程式碼如下:



$(document).ready(function( ){
$("#print").click(function(){
$(".my_show").jqprint();
})

});
script>

插件也提供了一些參數可配置，

複製程式碼 程式碼如下:

{
debug:false,//如果是true則可以顯示iframe查看效果（iframe預設高和寬都很小，可以再源碼中調大），預設是false
importCSS:true,//true表示引進原來的頁面的css，預設為true。 （如果是true，先會找$(“link[media=print]“)，若沒有會去找$(“link”)中的css檔案）
printContainer:true,//表示如果原來選擇的物件必須被納入列印（注意：設定為false可能會打破你的CSS規則）。
operaSupport:true//表示如果外掛程式也必須支援歌opera瀏覽器，在這種情況下，它提供了建立一個暫時的列印標籤。預設是true

} 而我自己使用到的只有importCSS：原始頁面中的連結將會匯入到iframe。第一次它媒體searchs=列印，如果沒有，將導入的正常的css檔。 importCSS範例： 複製程式碼複製程式碼 程式碼如下$('.my_show').jqprint({ importCSS://CSS樣式檔});