목차
onbeforeprint 예제 - 인쇄 버튼 존재 X 경우 onbeforeprint 정의 onbeforeprint 구문 onbeforeprint 예제 - 인쇄 버튼 존재 O 경우
onbeforeprint 예제 - 인쇄 버튼 존재 X 경우
※ 키보드로 「Ctrl + P」 단축키 누르거나, 마우스 오른쪽 눌러 「인쇄」 클릭해서 인쇄창 띄워야 함.
<!DOCTYPE html>
<html>
<body onbeforeprint="homzzang()">
<h1>홈짱닷컴 (Homzzang.com)</h1>
<p> 홈페이지 제작관리 강의/대행</p>
<script>
function homzzang() {
alert("이 문서 인쇄 중.");
}
</script>
</body>
</html>
결과보기
onbeforeprint 정의
페이지 인쇄 시도 시 「인쇄 대화상자 나타나기 전」 실행할 코드 지정.
1. onbeforeprint 속성 사용 가능 태그 종류
<body>
2.
onbeforeprint 속성은 종종 onafterprint 속성과 함께 사용됨.
onbeforeprint 이벤트는 인쇄 때만 실행됨. 따라서 키보드로 (인쇄창 띄우기 단축키: Ctrl + P 키 ) 누르거나, 이벤트 핸들러에서 window.print() 호출하는 경우에만 사용 가능.
onbeforeprint 이벤트 시 실행코드 많으면 인쇄 지연시키니 주의.
(Chrome / Edge / Firefox)에서 사용 가능.
(Safari / Opera) 경우 지원 X
onbeforeprint 구문
HTML 방식
< element onbeforeprint=" myScript ">
JS 방식 (3가지)
object. onbeforeprint = ()=> {myScript };object . onbeforeprint= function(){ myScript }; object .addEventListener(" beforeprint", myScript );
[속성값]
myScript
인쇄 대화상자 나타나기 전 실행할 JS 코드
주의: 함수명 사용 시, 다른 곳은 전부 소괄호까지 사용해 함수 호출하나 핑크색 myScript 자리는 "함수명만" 사용해 함수 호출. 사용 방식 통일 권장.
onbeforeprint 예제 - 인쇄 버튼 존재 O 경우
<!DOCTYPE html>
<html>
<head>
</head>
<body onbeforeprint="homzzang()">
<button onclick="window.print()">인쇄</button>
</body>
</html>
결과보기
