1. 프로그램 설명
1) 이 프로그램은 페이지에서 인쇄할 영역을 선택하고 iframe 모드로 인쇄할 수 있습니다.
2) 원본 print()와의 차이점은 인쇄 페이지를 취소한 후에도 현재 액세스한 페이지의 내용을 완전히 유지할 수 있다는 점입니다.
2. 코드 부분
1) JS 기능:
다음과 같이 코드 코드를 복사합니다.
함수 do_print(id_str)//id-str은 해당 영역의 ID를 인쇄합니다.
{
var el = document.getElementById(id_str);
var iframe = document.createElement('IFRAME');
바르독 = null;
iframe.setAttribute('style', 'position:absolute;width:0px;height:0px;left:-500px;top:-500px;');
document.body.appendChild(iframe);
doc = iframe.contentWindow.document;
//인쇄용 CSS 스타일을 도입합니다. www.111Cn.net에서는 실제 상황에 따라 수정합니다.
doc.write("<LINK rel="stylesheet" type="text/css" href="css/print.css">");
doc.write('<div>' + el.innerHTML + '</div>');
doc.close();
iframe.contentWindow.focus();
iframe.contentWindow.print();
if (navigator.userAgent.indexOf("MSIE") > 0)
{
document.body.removeChild(iframe);
}
}
2) HTML:
다음과 같이 코드 코드를 복사합니다.
//인쇄 영역:
<div id="print_box">
...
</div>
// 인쇄 호출
<button onclick="javascript:do_print('print_box');">인쇄</button>
3. 테스트
인쇄를 테스트하려면 페이지의 인쇄 버튼을 클릭하세요.
위의 방법 외에도 jquery를 사용하여 인스턴스화할 수도 있습니다. 코드는 다음과 같습니다.
다음과 같이 코드 코드를 복사합니다.
<script type="text/javascript" src="jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="jquery.PrintArea.js"></script>
<스크립트>
$(문서).ready(함수(){
$("input#biuuu_button").click(function(){
$("div#myPrintArea").printArea();
});
});
</script>
<input id="biuuu_button" type="button" value="인쇄"></input>
<div id="myPrintArea">.....텍스트 인쇄 부분.....</div>
영역 인쇄를 원할 경우 다음 방법을 시도해 볼 수 있습니다.
다음 기사에서는 페이지 전체를 인쇄할 수 있을 뿐만 아니라 페이지의 특정 영역을 인쇄할 수도 있는 매우 간단한 방법을 공유합니다.
다음과 같이 코드 코드를 복사합니다.
<html>
<머리>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<스크립트 언어="자바스크립트">
함수 printdiv(printpage){
var headstr="<html><head><title></title></head><body>";
var footstr="</body>";
var newstr=document.all.item(printpage).innerHTML;
var oldstr=document.body.innerHTML;
document.body.innerHTML=headstr+newstr+footstr;
window.print();
document.body.innerHTML=oldstr;
거짓을 반환;
}
</script>
<title>div 인쇄</title>
</head>
<본문>
<input type="button" onClick="printdiv('div_print');" value=" 인쇄">
<div id="div_print">
<h1 style="Color:Red">인쇄 영역: www.VeVB.COm</h1>
</div>
이 영역은 인쇄할 수 없습니다!
</body>
</html>