jQuery實(shí)現(xiàn)區(qū)域打印功能代碼詳解
使用CSS控制打印樣式,需要設(shè)置樣式media="print",并且將頁(yè)面中不需要打印的元素的樣式display屬性設(shè)置為none。如DEMO中,我將頁(yè)頭頁(yè)腳及其他不需要打印的元素的樣式設(shè)置如下:
<style type="text/css" media="print"> #header,.top_title,#jqprint,#footer,#cssprint h3{display:none} </style>
用jQuery打印插件printArea.js
$(function(){ $("#print_btn").click(function(){ $("#my_area").printArea(); }); });
DEMO中有這樣一段代碼:
<p><a href="#" id="print_btn">點(diǎn)擊這里打印>></a></p> <div id="my_area"> ...打印區(qū)域...<br/> </div>
當(dāng)單擊打印按鈕時(shí),調(diào)用件printArea.js插件。該插件還提供了一些參數(shù)可配置,使用方法:$(element).printArea(option)。
參數(shù)設(shè)置:
1、mode:模式,當(dāng)點(diǎn)擊打印按鈕時(shí)觸發(fā)模式,默認(rèn)為iframe,當(dāng)設(shè)置為popup則會(huì)新開(kāi)一個(gè)窗口頁(yè)面打印。
2、popTitle:設(shè)置新開(kāi)窗口的標(biāo)題,默認(rèn)為空。
3、popClose:完成打印后是否關(guān)閉窗口,默認(rèn)為false。
PS:IE瀏覽器打印頁(yè)面取出頁(yè)眉頁(yè)腳網(wǎng)址的方法:文件->頁(yè)面設(shè)置,將頁(yè)面和頁(yè)腳的輸入框清空即可。
以上所述是小編給大家介紹的jQuery實(shí)現(xiàn)區(qū)域打印功能代碼詳解,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
jQuery實(shí)現(xiàn)的點(diǎn)贊隨機(jī)數(shù)字顯示動(dòng)畫(huà)效果(附在線演示與demo源碼下載)
這篇文章主要介紹了jQuery實(shí)現(xiàn)的點(diǎn)贊隨機(jī)數(shù)字顯示動(dòng)畫(huà)效果,并附帶在線演示與demo源碼供讀者下載.涉及jQuery鼠標(biāo)事件響應(yīng)及基于animate動(dòng)畫(huà)效果實(shí)現(xiàn)技巧,需要的朋友可以參考下2015-12-12自己使用jquery寫(xiě)的一個(gè)無(wú)縫滾動(dòng)的插件
這篇文章主要介紹的是自己使用jquery寫(xiě)的一個(gè)無(wú)縫滾動(dòng)的插件,個(gè)人感覺(jué)還不錯(cuò),需要的朋友可以參考下2014-04-04可以浮動(dòng)某個(gè)物體的jquery控件用法實(shí)例
這篇文章主要介紹了可以浮動(dòng)某個(gè)物體的jquery控件,實(shí)例分析了jquery控件實(shí)現(xiàn)頁(yè)面浮動(dòng)層的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下2015-07-07jQuery創(chuàng)建及操作xml格式數(shù)據(jù)示例
這篇文章主要介紹了jQuery創(chuàng)建及操作xml格式數(shù)據(jù),結(jié)合實(shí)例形式分析了jQuery針對(duì)xml格式數(shù)據(jù)的創(chuàng)建、解析、添加等相關(guān)操作技巧,需要的朋友可以參考下2018-05-05jQuery簡(jiǎn)單實(shí)現(xiàn)彩色云標(biāo)簽效果示例
這篇文章主要介紹了jQuery簡(jiǎn)單實(shí)現(xiàn)彩色云標(biāo)簽效果,結(jié)合實(shí)例形式分析了jQuery隨機(jī)數(shù)運(yùn)算與頁(yè)面元素樣式動(dòng)態(tài)操作相關(guān)技巧,需要的朋友可以參考下2016-08-0813 款最熱門(mén)的 jQuery 圖像 360 度旋轉(zhuǎn)插件推薦
這篇文章主要介紹了13 款最熱門(mén)的 jQuery 圖像 360 度旋轉(zhuǎn)插件,非常炫酷實(shí)用,有需要的小伙伴參考下2014-12-12jQuey將序列化對(duì)象在前臺(tái)顯示地實(shí)現(xiàn)代碼(方法總結(jié))
本文給大家分享jQuey將序列化對(duì)象在前臺(tái)顯示地的幾種方式,非常不錯(cuò),具有參考借鑒價(jià)值,需要的朋友一起看看吧2016-12-12