一本久久伊人热热精品中文字幕_ Web表格打印頁(yè)面的生成 - amp@java

要把一個(gè)長(cháng)表格打印出來(lái)，要做到正確分頁(yè)，直接用HTML生成表格是不能滿(mǎn)足要求的：
1、如果把整個(gè)表格放在一頁(yè)，在打印時(shí)再自動(dòng)分頁(yè)，則有可能在某一表格行中間分頁(yè)，而且只能有一個(gè)表格頭，不能每頁(yè)一個(gè)，因為你不知道會(huì )在哪里分頁(yè)；
2、如果按照固定的行數分頁(yè)，由于每行的高度不一樣，就會(huì )造成有的頁(yè)不能填滿(mǎn)，有的卻太滿(mǎn)自動(dòng)分頁(yè)了。

原來(lái)考慮過(guò)一種方法：
利用Javascript動(dòng)態(tài)生成表格，每次往表格的最后插入一行，然后檢查表格高度，如果高度超過(guò)了一頁(yè)的最大高度，則把這一行刪除，新建一個(gè)表格，把這一行插入到新的表格里面，如此循環(huán)，直到全部行插入完畢。但是，利用table的height屬性、style.height屬性都得不到表格的實(shí)際高度（只有設置了height屬性、style的height屬性才能取得這兩個(gè)值，但只是設置值，并不是實(shí)際值），于是就只能放棄了。

后來(lái)仔細查看了table的dom屬性，才知道它還有clientHeight,offsetHeight等屬性，這兩個(gè)才是表格的真正高度，它們之間的區別可看這里：
http://developer.mozilla.org/cn/docs/DOM:element.clientHeight
http://developer.mozilla.org/en/docs/DOM:element.offsetHeight
更直觀(guān)的可以看這里：
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/om/measuring.asp

簡(jiǎn)單地說(shuō)，clientHeight就是不包含border的高度，offsetHeight就是連border的高度。對于要打印的表格，border一般只有2px，所以用clientHeight和offsetHeight區別不大。

構建這個(gè)頁(yè)面需要用到的：

table的insertRow(),deleteRow()方法，用來(lái)給表格增加、刪除一行(tr)；
tr的insertCell()方法，用來(lái)給一行加入一格(td)；
td的innerText屬性，用來(lái)給一格加入內容。

CSS分頁(yè)要用到page-break-before:always(或page-break-after:aways)的樣式，遇到使用了該樣式的標簽，就會(huì )在標簽前面（或后面）強制分頁(yè)，于是可以在兩個(gè)表格之間加一個(gè)這樣的分頁(yè)。
為了顯示而不打印，還要用到<style>標簽的media屬性，當設置
<style media="print">
.noprint {display:none}
</style>
時(shí)，用了noprint作為class的標簽就只會(huì )顯示而不打印出來(lái)。

對于IE，還可以使用WebBrowser控件，彈出“頁(yè)面設置”窗口、“打印預覽”窗口、直接打印等功能。對于其他瀏覽器，則只能調用window.print()函數了。

JSF生成的中文都是用&#unicode;來(lái)表示的，其中unicode是中文字符的UNICODE編碼，通過(guò)innerText生成表格內容時(shí)，必須把這些東西轉換成真正的中文，否則會(huì )直接把這些符號插入到表格中，慘不忍睹。javascript里有個(gè)String.fromCharCode()函數可以把Unicode編碼轉換成字符。另外，通過(guò)innerHTML加入內容也可把這些編碼正常顯示出來(lái)，但需要escape XML，以免把內容當作HTML標簽渲染。

posted on 2006-11-07 10:11 amp@java 閱讀(318) 評論(5) 編輯收藏引用收藏至365Key 所屬分類(lèi): JSF

1、如果把整個(gè)表格放在一頁(yè)，在打印時(shí)再自動(dòng)分頁(yè)，則有可能在某一表格行中間分頁(yè)，而且只能有一個(gè)表格頭，不能每頁(yè)一個(gè)，因為你不知道會(huì )在哪里分頁(yè)；
2、如果按照固定的行數分頁(yè)，由于每行的高度不一樣，就會(huì )造成有的頁(yè)不能填滿(mǎn)，有的卻太滿(mǎn)自動(dòng)分頁(yè)了。

ie在打印的時(shí)候不但可以在每頁(yè)自動(dòng)添加，還可以自動(dòng)添加表腳，當然還可以自動(dòng)判斷長(cháng)度分頁(yè)，實(shí)現這些都不需要半點(diǎn)腳本。請看這個(gè)例子（使用了內置打印控件來(lái)預覽，如果被瀏覽器禁止了需要手工使用打印預覽功能或者打印出來(lái)）

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function pageSetup(){try{WB.ExecWB(8,1)}catch(e){alert("您的瀏覽器不支持此功能")}}
function preview(){try{WB.ExecWB(7,1)}catch(e){alert("您的瀏覽器不支持此功能")}}
</SCRIPT>
<style>
td,th{border-bottom:1px solid black;width:70px}
thead{display:table-header-group}
tfoot{display:table-footer-group}
</style>
</HEAD>
<BODY>
<OBJECT classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 id=WB width=0 VIEWASTEXT></OBJECT>
<TABLE cellspacing=0 align=center>
<thead><th> 姓名 </th><th> 地址 </th><th> 籍貫 </th><th>畢業(yè)學(xué)校</th><th> 年齡 </th><th> 性別 </th><th> 婚否 </th></thead>
<tbody align=center>
<SCRIPT LANGUAGE="JavaScript">

</SCRIPT>
</tbody>
<tfoot><th colspan=7 align=center style="width:100%">這是一個(gè) 測試</th></tfoot>
</TABLE>
</BODY>
<SCRIPT LANGUAGE="JavaScript">
preview();
</SCRIPT>
</HTML>

例子中特意使用腳本構造了隨機高度的行。回復

# re: Web表格打印頁(yè)面的生成 2006-11-08 02:25 emu

這個(gè)例子在firefox下面使用的時(shí)候頁(yè)腳有顯示不完整的現象。不知道是否firefox的打印預覽功能的bug。為tbody添加上display: table-row-group樣式后有一些改觀(guān)但是沒(méi)有完全解決。回復

# re: Web表格打印頁(yè)面的生成 2006-11-08 22:04 amp@java

謝謝，我現在才知道還有display:table-header-group這個(gè)樣式。

不過(guò)不用腳本生成表格的話(huà)還是有可能會(huì )把行攔腰截斷，上面那個(gè)不截斷，是因為行高比較小，我稍稍改了一下每行的內容，就出現了：

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function pageSetup(){try{WB.ExecWB(8,1)}catch(e){alert("您的瀏覽器不支持此功能")}}
function preview(){try{WB.ExecWB(7,1)}catch(e){alert("您的瀏覽器不支持此功能")}}
</SCRIPT>
<style>
td, th{border-bottom:1px solid black;width:70px}
thead{display:table-header-group}
tfoot{display:table-footer-group}
</style>
</HEAD>
<BODY>
<OBJECT classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 id=WB width=0 VIEWASTEXT></OBJECT>
<TABLE cellspacing=0 align=center border=1>
<thead><th> 姓名 </th><th> 地址 </th><th> 籍貫 </th><th>畢業(yè)學(xué)校</th><th> 年齡 </th><th> 性別 </th><th> 婚否

</th></thead>
<tbody align=center>
<SCRIPT LANGUAGE="JavaScript">


</SCRIPT>
</tbody>
<tfoot><th colspan=7 align=center style="width:100%">這是一個(gè) 測試</th></tfoot>
</TABLE>
</BODY>
<SCRIPT LANGUAGE="JavaScript">
preview();
</SCRIPT>
</HTML> 回復

# re: Web表格打印頁(yè)面的生成 2006-11-09 01:27 emu

實(shí)際應用當中，就要考慮行高是否真的這么自由，分行是否真的這么不可接受了了。比如說(shuō)，行高超過(guò)了一頁(yè)怎么辦，不得不分行的時(shí)候是否還需要保持每頁(yè)的表頭表腳，不用樣式而用腳本的話(huà)，表頭表腳要如何正確的呈現？

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function pageSetup(){try{WB.ExecWB(8,1)}catch(e){alert("您的瀏覽器不支持此功能")}}
function preview(){try{WB.ExecWB(7,1)}catch(e){alert("您的瀏覽器不支持此功能")}}
</SCRIPT>
<style>
td, th{border-bottom:1px solid black;width:70px}
thead{display:table-header-group}
tfoot{display:table-footer-group}
</style>
</HEAD>
<BODY>
<OBJECT classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 id=WB width=0 VIEWASTEXT></OBJECT>
<TABLE cellspacing=0 align=center border=1>
<thead><th> 姓名 </th><th> 地址 </th><th> 籍貫 </th><th>畢業(yè)學(xué)校</th><th> 年齡 </th><th> 性別 </th><th> 婚否 </th></thead>
<tbody align=center>
<SCRIPT LANGUAGE="JavaScript">
document.write("<tr>");
for(var j=0;j<7;j++)
document.write("<td>"+(new Array(10).join("有可能在某一表格行中間分頁(yè)在某一表格行中間分頁(yè)"))+"</td>");
document.write("</tr>");
</SCRIPT>
</tbody>
<tfoot><th colspan=7 align=center style="width:100%">這是一個(gè) 測試</th></tfoot>
</TABLE>
</BODY>
<SCRIPT LANGUAGE="JavaScript">
preview();
</SCRIPT>
</HTML> 回復

# re: Web表格打印頁(yè)面的生成 2006-11-09 09:32 amp@java

行高超過(guò)一頁(yè)的情況是極少的，但一般3-4行文字的高度是經(jīng)常有的，這樣的高度就足以造成一行分兩頁(yè)，我的應用中就遇到過(guò)，打印出來(lái)有點(diǎn)奇怪。使用腳本生成表格之后，每頁(yè)一個(gè)完整的表格，而且基本能滿(mǎn)一頁(yè)，看起來(lái)舒服點(diǎn)。

腳本可以生成任意HTML，當判斷表格高度滿(mǎn)一頁(yè)的時(shí)候，就利用 page-break-before:always 樣式生成一個(gè)分頁(yè)符，再新建一個(gè)表格，這個(gè)表格就在下一頁(yè)了，可以通過(guò)腳本往里面加入新的內容，表格的表頭和表腳都可以用腳本生成。另外，用innerHTML就可以在某標簽范圍內加入任意HTML語(yǔ)句，所以還可以生成其他的內容。

本站僅提供存儲服務(wù)，所有內容均由用戶(hù)發(fā)布，如發(fā)現有害或侵權內容，請點(diǎn)擊舉報。

欧美性猛交XXXX免费看蜜桃,成人网18免费韩国,亚洲国产成人精品区综合,欧美日韩一区二区三区高清不卡,亚洲综合一区二区精品久久

評論