메뉴 건너뛰기

조회 수 6285 추천 수 0 댓글 0
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
?

단축키

Prev이전 문서

Next다음 문서

크게 작게 위로 아래로 댓글로 가기 인쇄
<script language="javascript">
function content_print(){

var initBody = document.body.innerHTML;
window.onbeforeprint = function(){
document.body.innerHTML = document.getElementById('인쇄할 DIV 아이디').innerHTML;
}
window.onafterprint = function(){
document.body.innerHTML = initBody;
}
window.print();
}
</script>


화면의 어느 곳이든 아래의 링크를 넣어주세요

<a href=# onclick="javascript:content_print();">인쇄하기</a>

저의 경우엔 테크노트로 홈페이지와 함께 웹발주시스템을 구성해 사용 중인데요
이 때 기간별 거래내역 등을 글목록을 활용해서 보여주고 있거든요.
그러다 보니 거래처에서 이 내용을 프린트하려면 반드시 필요한 기능이 글목록 인쇄 기능이어서..
이런저런 궁리를 하다가 막히던 찰나.. DIV를 활용하면 되겠다 싶어 적용했는데 아주 잘되더라구요.
검색을 하다가 저처럼 글목록 인쇄를 원하시는 분들이 더러 있는 걸 알게 되서 이렇게 팁을 올려드립니다.

DIV를 활용하여 인쇄하기의 좋은 점!

1. 여기 저기 설정을 손 볼 필요가 없고, div로 특정영역을 묶기만 하면 되니 적용 방법이 정말 간단하죠
2. 웹페이지를 인쇄할 때면 상하에 자리한 버튼 또는 위 아래 부분에 생기는 URL 부분 등 잡다한 내용들이
빠지고 꼭 필요한 내용만 인쇄할 수 있어서 마치 엑셀로 작업해놓은 듯 군더더기 없는 인쇄 품질을 보여줍니다.
3. 쇼핑몰에서 상품별 상세페이지를 인쇄할 때도 유용하게 쓰이구요
화면의 어느 부분이든 원하는 대로 영역을 지정해 인쇄할 수 있도록 구성하니 고객들의 반응이 참 좋아요.

참고로 저는 윈7, 익스8 환경에서 적용했습니다.

List of Articles
번호 제목 날짜 조회 수
87 'setInterval', 타이머를 사용하자! ==setTimeout 2015.02.03 6222
86 'blur', 이미지 클릭시 테두리를 없애자! file 2015.02.03 7349
85 'setTimeout', 타이머를 사용하자! file 2015.02.03 7033
84 'opener', 부모창과 자식창의 텍스트를 교환하자! file 2015.02.03 7308
83 'open', 새창을 열어보자! file 2015.02.03 6036
82 'checkbox', 체크박스 모두체크 그리고 모두해제! file 2015.02.03 7492
81 'button', 클릭한 횟수 알아내기! file 2015.02.03 10745
80 유효성 검사, 모든 폼에 값이 입력되도록 해보자! file 2015.02.03 6121
79 'focus', 엔터 누르고 이동하자! file 2015.02.03 12855
78 5초후 자동으로 창닫기 2015.02.03 9025
77 달력 2015.02.03 6682
76 양력-음력 2015.02.03 7620
75 버튼 삭제 2015.02.03 5951
74 라디오 바스 체크 유무 확인 2015.02.03 6349
73 문자열 바꾸기 2015.02.03 5725
72 마우스로 이미지크기 조절(자바스크립트) 2015.02.03 6523
71 페이지 로드 할때 컨트롤에 포커스 주기 2015.02.03 8500
70 자바스크립트 영문입력, 숫자만입력, 한글만 입력, 붙여넣기 방지 2015.02.02 10175
69 이미지 마우스 드래그로 스크롤을 움직이는 소스 2014.03.17 9356
68 특정부위 마우스 오버시 설명을 보여주는 소스 2014.03.17 8690
Board Pagination Prev 1 ... 4 5 6 7 8 9 10 11 12 13 Next
/ 13

하단 정보를 입력할 수 있습니다

© k2s0o1d4e0s2i1g5n. All Rights Reserved