1. 程式人生 > >html 頁面實現列印(jqprint)

html 頁面實現列印(jqprint)

使用的一些問題:
出現Cannot read property ‘opera’ of undefined錯誤問題是juqery版本相容問題
解決方法:加入遷移輔助外掛jquery-migrate-1.0.0.js可解決版本問題
(上面的下載中包含這些檔案)

<script src="js/jquery/jquery-migrate-1.2.1.min.js"></script>

實際上是列印頁面中的某個 html 下的所有元素。 所以列印的時候需要把這個元素調整到 列印的大小
如果是列印 A4 可以設定 列印元素(最外層)widht:210mm;height:297mm這樣就剛好是A4大小。
(元素的 非行內樣式會 忽略。列印的時候自帶行內樣式)
那麼如何支援 css 連線

<link media="print" rel="stylesheet" type="text/css" href="XXX.css">

使用過程:
引用jquery和,jqprint到您的頁面

<script language="javascript" src="jquery-1.4.4.min.js"></script>
<script language="javascript" src="jquery.jqprint-0.3.js"></script>

呼叫方方法:

<script language="javascript"
>
function a(){ $("#ddd").jqprint(); } </script>

頁面:

<div id="ddd">
    <table>
        <tr>
            <td>test</td>
            <td>test</td>
            <td>test</td>
            <td>test</td>
            <td
>
test</td> </tr> </table> </div>
<input type="button" onclick=" a()" value="列印"/>

具體一點的引數:

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