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