Jqprint實現(xiàn)頁面打印
好些項目需要實現(xiàn)頁面打印，特別是一些后臺管理類系統(tǒng)，下面介紹一款輕量級的打印插件：
1、實現(xiàn)頁面打印要引入jQuery和Jqprint。點擊下載Jqprint插件
<script language="javascript" src="jquery-1.4.4.min.js"></script> <script language="javascript" src="jquery.jqprint-0.3.js"></script>
2、HTML代碼：
<div id="print-area"> <table> <tr> <td>test</td> <td>test</td> <td>test</td> <td>test</td> <td>test</td> </tr> <tr> <td>test</td> <td>test</td> <td>test</td> <td>test</td> <td>test</td> </tr> <tr> <td>test</td> <td>test</td> <td>test</td> <td>test</td> <td>test</td> </tr> <tr> <td>test</td> <td>test</td> <td>test</td> <td>test</td> <td>test</td> </tr> <tr> <td>test</td> <td>test</td> <td>test</td> <td>test</td> <td>test</td> </tr> </table> </div> <input type="button" onclick=" print()" value="打印">
3、JavaScript代碼：
<script language="javascript">
function print(){
$("#print-area").jqprint({
debug: false,
importCSS: true,
printContainer: true,
operaSupport: false
});
}
</script>
4、屬性
1) debug: false, //如果是true則可以顯示iframe查看效果（iframe默認高和寬都很小，可以再源碼中調(diào)大），默認是false
2) importCSS: true, //true表示引進原來的頁面的css，默認是true。（如果是true，先會找$("link[media=print]")，若沒有會去找$("link")中的css文件）
3) printContainer: true, //表示如果原來選擇的對象必須被納入打?。ㄗ⒁猓涸O(shè)置為false可能會打破你的CSS規(guī)則）。
4) operaSupport: false //表示如果插件也必須支持歌opera瀏覽器，在這種情況下，它提供了建立一個臨時的打印選項卡。默認是true
5、特殊打印樣式
如果在打印時需要獨特的css樣式，除了可以直接寫在style屬性內(nèi)還可以通過
<link href="printStyle.css" rel="stylesheet"type="text/css" media="print">
來引用外部css文件中的樣式。這樣的好處是該樣式只會在打印時才應用。
以上就是本文的全部內(nèi)容，希望本文的內(nèi)容對大家的學習或者工作能帶來一定的幫助，同時也希望多多支持腳本之家！
相關(guān)文章
jQuery模擬原生態(tài)App上拉刷新下拉加載更多頁面及原理
很多App中,新聞或者展示類都存在下拉刷新和上拉加載的效果，如何實現(xiàn)上拉刷新下拉加載更多頁面的呢？下面小編通過下面內(nèi)容給大家介紹jQuery模擬原生態(tài)App上拉刷新下拉加載更多頁面及原理，需要的朋友可以參考下2015-08-08
這篇文章主要介紹了jQuery實現(xiàn)的多級下拉菜單效果代碼,涉及jquery鼠標事件及頁面元素的顯示與隱藏效果實現(xiàn)技巧,非常具有實用價值,需要的朋友可以參考下2015-08-08
基于jQuery Bar Indicator 插件實現(xiàn)進度條展示效果
這篇文章主要介紹了基于jQuery Bar Indicator 插件實現(xiàn)進度條展示效果的相關(guān)資料,需要的朋友可以參考下2015-09-09
用Jquery重寫windows.alert方法實現(xiàn)思路
本文將介紹下用Jquery重寫windows.alert方法，已經(jīng)在 IE8 , firefox3.0.11下面測試通過，喜歡的朋友可以放心使用2013-04-04
用jquery和json從后臺獲得數(shù)據(jù)集的代碼
最近正在用ajax無刷新做網(wǎng)站，發(fā)現(xiàn)數(shù)據(jù)很好傳輸，但是數(shù)據(jù)集不知道怎么獲得，于是，上網(wǎng)查了一些資料來傳輸數(shù)據(jù)，現(xiàn)在和大家分享一下，不知道的童鞋可以和我一起學習，知道的請指點一二。我選擇的方法是用json 來獲取數(shù)據(jù)集2011-11-11
javascript特殊用法你知道嗎？下面為大家介紹下與function函數(shù)相關(guān)的東西2013-11-11
這篇文章主要為大家詳細介紹了JQuery核心函數(shù)是什么，及使用方法介紹，感興趣的小伙伴們可以參考一下2016-05-05
基于jQuery的圖片左右無縫滾動插件,需要的朋友可以參考下2012-05-05
jQuery插件FusionCharts實現(xiàn)的MSBar3D圖效果示例【附demo源碼】
這篇文章主要介紹了jQuery插件FusionCharts實現(xiàn)的MSBar3D圖效果,結(jié)合完整實例形式分析了jQuery使用FusionCharts載入xml數(shù)據(jù)繪制MSBar3D圖的相關(guān)操作技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2017-03-03
jQueryMobile之窗體長內(nèi)容的缺陷與解決方法實例分析
這篇文章主要介紹了jQueryMobile之窗體長內(nèi)容的缺陷與解決方法,結(jié)合具體實例形式分析了jQueryMobile底部懸浮層遮擋情況下的解決方法,非常簡單實用,需要的朋友可以參考下2017-09-09