본문 바로가기
프로그래밍/HTML, CSS, JavaScript

[JavaScript] 원하는 부분 프린터 하기-print()

by [바가지] 2019. 2. 1.
반응형

자바스크립트 인쇄하기

 

인터넷 화면을 프리터 할 때 오른쪽 마우스 버튼을 눌러 인쇄 기능을 이용합니다.

이 인쇄 기능을 호출 하는 자바스크립트 함수가 windows.print() 입니다.

 

그런데 화면의 특정부분만 인쇄 할 수 있도록 기능을 추가 하고 싶은 경우가 있습니다.

또는 화면의 구조 및 특성으로 인해 인쇄를 하면 오류가 발생하는 경우 오류가 발생하지 않도록 제어하길 원하는 경우가 있습니다.

그런 경우 간다하게 사용 하는 방법 입니다.

 

 

var printDiv;
var initBody;

function printDiv2 (divId) {
    printDiv = document.all[divId];
    
    window.onbeforeprint = beforePrint;
    window.onafterprint = afterPrint;
    
    window.print(); 
}

 

function beforePrint(){
    initBody = document.body.innerHTML;
    document.body.innerHTML = printDiv.innerHTML;
}

function afterPrint(){
    document.body.innerHTML = initBody;
}

 

방법은 간단합니다.

프린터 함수를 호출하기 전 document.body.innerHTML 값을 프리터를 원하는 영역(Div ID) 의 innerHTML 값으로 입력 한 뒤 프리터가 끝나면 기존 innerHTML로 변경 해 주는 것 입니다.

 

기존 구현되어 있던 출력기능이 오류가 발생하여 작업 후 올려 봅니다.

반응형