jquery를 이용해서 원하는 영역 프린트하기

 

         $(function () {
            $('#btnPrint').click(function () {
                printByJquery({
                    printMode: 'popup', //팝업설정 popup = 팝업창 , iframe = iframe
                    overrideElementCSS: ['webPrint.css', { href: 'webPrint.css', media: 'print'}], //css경로
                    pageTitle: '인쇄 타이틀', //인쇄 타이틀
                    leaveOpen: false //false = 인쇄후 창닫기
                });
            });
        });

        function printByJquery(options) {
            $("#target").printElement(options); // 이부분이 실제 프린트될 부분을 연결시켜준다.
        }

 

jquery.printElement.js

파일을 연결한 후 위와 같이 스크립트를 작성하고 인쇄될 영역안에 내용을 입력하면 프린트가 가능하다.

 

<div id="target">프린트 테스트</div>

<span id="btnPrint">인쇄하기</span>

 

프린터 출력시 주소 / 페이지 가 같이 출력되어 지저분한 경우가 있는데 이때는 IE의 파일 > 페이지설정에서

머리글 / 바닥글을 모두 비어있음으로 설정하면 깔끔하게 프린트 할 수 있다.