利用 css 實現區域性列印功能

2021-10-11 14:36:58 字數 1404 閱讀 1703

在實現列印功能時,遇到乙個問題,就是列印時,列印按鈕出現在列印的頁面?

lang

="en"

>

>

charset

="utf-8"

>

name

="viewport"

content

="width=device-width, initial-scale=1.0"

>

>

documenttitle

>

type

="text/css"

>

@media print

}style

>

type

="text/css"

media

="print"

>

.noprint

style

>

head

>

>

class

="content"

>

>

沒有新增 noprint 列印button

>

"print"

class

="noprint"

>

新增 noprint 列印button

>

>

>

這裡是需要列印的內容h1

>

>

上面的預覽和列印按鈕不希望列印,如果要過濾的話可以做下面的樣式設定h2

>

>

jqprint是乙個基於jquery編寫的頁面列印的乙個小外掛程式,但是不得不承認這個外掛程式確實很厲害,最近的專案中幫了我的大忙,在web列印的方面,前端的列印基本是靠window.print()的方式進行列印的,而這個外掛程式在其基礎上進行了進一步的封裝,可以輕鬆實現列印網頁上的某個區域,這是個亮點。p

>

>

jqprint是乙個基於jquery編寫的頁面列印的乙個小外掛程式,但是不得不承認這個外掛程式確實很厲害,最近的專案中幫了我的大忙,在web列印的方面,前端的列印基本是靠window.print()的方式進行列印的,而這個外掛程式在其基礎上進行了進一步的封裝,可以輕鬆實現列印網頁上的某個區域,這是個亮點。p

>

div>

div>

>

document.

getelementbyid

('print').

addeventlistener

('click'

,function()

)script

>

body

>

html

>

iframe實現區域性列印

網頁中用到jquery.dialog,需要把dialog裡面的內容列印出來,開始直接用window.print 因為我電腦沒有連印表機,也沒有測試,在專案演示的時候乙個同事就列印出來,看效果,太囧了,列印出來的不是div裡面的內容,而是當前螢幕所能看到的內容。在網上查了很多資料,有的看不懂,有的嘗試...

js實現區域性列印及其列印預覽

js 實現簡單的頁面區域性列印 function preview oper else 使用很簡單 將頁面內要列印的內容加入中間 xx 再加個列印按紐 nclick preview 1 序號總和 15 年齡總和 109 成績總和 413 序號年齡成績總和112 序號年齡成績總和104 序號年齡成績總和...

JS實現區域性列印和預覽

第一種 js 實現簡單的頁面區域性列印 function preview oper else 使用很簡單 將頁面內要列印的內容加入中間 xx 再加個列印按紐 nclick preview 1 第二中 元件法 一 webbrowser控制項 二 webbrowder控制項的方法 列印 webbrows...