프리랜서 웹디자이너 웹퍼블리셔RELATION

RELATION 로고

홈페이지 소스

[SCRIPT] window.print와 div 를 이용한 화면 부분 인쇄법

2012.10.03
북마크 [출처 이동]    작성자 정보
인쇄할 페이지의 레이어를 현재 내용이 있는 레이어와 빈 레이어로 설정해 둡니다.

인쇄버튼을 클릭했을 경우 내용이 들어있는 레이어를 안 보이게 설정해 두고

내용이 들어있는 레이어중에 출력하길 원하는 부분만 빈 레이어에 설정해 그 레이어만 노출시켜

인쇄를 합니다. 인쇄가 완료되면 노출된 레이어의 내용을 제거하고 숨겨진 원본을 다시 노출시킵니다.



============================================
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 인쇄 테스트 </TITLE>

<script language="JavaScript">
function printLayer () {
if (document.all && window.print) {
window.onbeforeprint = beforeLayer;
window.onafterprint = afterLayer;
window.print();
}
}
function beforeLayer () {
if (document.all) {
objContents.style.display = 'none';
objSelection.innerHTML = document.all['printArea'].innerHTML;
}
}
function afterLayer () {
if (document.all) {
objContents.style.display = 'block';
objSelection.innerHTML = "";
}
}
</script>
</HEAD>


<BODY>
<DIV ID="objContents">
이건 안찍을꺼란 말이지...
<input type="button" value="출력" onclick="printLayer();">
<DIV id="printArea" name="taxBill">
이걸 찍을꺼야~~~
</DIV>
</DIV>

<DIV ID="objSelection">
</DIV>
</BODY>
</HTML>

이 포스트 공유하기

전체목록