javascript 呼叫瀏覽器的列印方法。並設定列印為橫向列印
阿新 • • 發佈：2018-12-31
最近做一個簡單的列印功能，要使用JavaScript呼叫瀏覽器的列印功能。並設定列印為橫向列印：
為了適應A4紙的寬和高這裡設定：
body{margin:0 auto;
width: 1010px;
height: 369px;
}為了在頁面做一個列印的按鈕，但是在真實列印的時候該按鈕又不能顯示在列印頁面上，這裡我加了兩個標識性的註釋
<!--begin--><!--end-->並寫了一個列印的方法，在呼叫該方法是擷取掉列印中不需要顯示的內容，只包括標識性標籤中的內容：
<script 例項展示：
<style type="text/css">
body{margin:0 auto;
width: 1010px;
height: 369px;
}
</style>
<head>
<title>列印標題</title>
<script type="text/javascript">
function printit(){
if (confirm('確定列印嗎？')){
try{
print.portrait = false ;//橫向列印
}catch(e){
//alert("不支援此方法");
}
var bdhtml=window.document.body.innerHTML;//獲取當前頁的html程式碼
var sprnstr="<!--begin-->";//設定列印開始區域
var eprnstr="<!--end-->";//設定列印結束區域
var prnhtml=bdhtml.substring(bdhtml.indexOf(sprnstr)); //從開始程式碼向後取html
var prnhtml=prnhtml.substring(0,prnhtml.indexOf(eprnstr));//從結束程式碼向前取html
window.document.body.innerHTML=prnhtml;
window.print();
window.document.body.innerHTML=bdhtml;
}
}
</script>
<style type="text/css">
.ipt{
cursor: pointer;
}
</style>
</head>
<body>
<OBJECT id="WebBrowser" classid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2" height=0 id=wb name=wb width=3></OBJECT>
<div id="kpr" style="margin:30px">
<input class="ipt" type="button" value="列印" onclick ="javascript:printit();">
<input class="ipt" type="button" value="關閉" onclick ="javascript:window.close();">
</div>
<!--begin-->
<h3>列印標題</h3>
<table>
<tr>
<td>內容</td>
<td>內容</td>
<td>內容</td>
<td>內容</td>
<td>內容</td>
<td>內容</td>
<td>內容</td>
<td>內容</td>
</tr>
<tr>
<td>內容2</td>
<td>內容2</td>
<td>內容2</td>
<td>內容2</td>
<td>內容2</td>
<td>內容2</td>
<td>內容2</td>
<td>內容2</td>
</tr>
</table>
<!--end-->
</body>預覽：
列印效果，點選列印按鈕–>確定：
