원하는 프레임만 프린트하기

IT노트/javaScript 2015. 3. 1. 19:40

원하는 프레임만 프린트하기

인쇄미리보기 및 페이지설정버튼 만들기

▶원하는 프레임만 프린트하기(프레임이 설정된 상태에서 적용가능)

<html>
<head>
</head>
<body>
<a href="#"onclick="parent.프레임이름.focus();window.print();">프린트하기</a>
</body>
</html>



▶인쇄미리보기 및 페이지설정버튼 만들기

<html>
<head>
<script language="JavaScript">
!--
function ieExecWB( intOLEcmd, intOLEparam )
{
// 웹 브라우저 컨트롤 생성
var WebBrowser = '<OBJECT ID="WebBrowser1" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';
// 웹 페이지에 객체 삽입
document.body.insertAdjacentHTML('beforeEnd', WebBrowser);
// if intOLEparam이 정의되어 있지 않으면 디폴트 값 설정
if ( ( ! intOLEparam ) || ( intOLEparam < -1 ) || (intOLEparam > 1 ) )
intOLEparam = 1;
// ExexWB 메쏘드 실행
WebBrowser1.ExecWB( intOLEcmd, intOLEparam );
// 객체 해제
WebBrowser1.outerHTML = "";
}
// -->
</script>
</head>
<body>
<input type=button value="인쇄 미리 보기" onclick="window.ieExecWB(7)"><br>
<input type=button value="페이지 설정" onclick="window.ieExecWB(8)"><br>
<input type=button value="인쇄하기(대화상자 표시)" onclick="window.ieExecWB(6)"><br>
<input type=button value="인쇄 바로 하기" onclick="window.ieExecWB(6, -1)"><br>
</body>

 

---------------------------------------------------------------------------------------

 

비록 인터넷 익스플로러에서만 동작하긴 하지만 브라우저의 "인쇄 미리 보기"와 "페이지 설정" 메뉴를 프로그래밍적으로 실행시킬 수 있는 방법이 있다. 우선 아래 버튼을 클릭한 후 어떤 결과가 나오는지 확인해 보기 바란다. (인터넷 익스플로러 4 이상에서 동작한다.)

      

위 예제와 같은 결과를 얻으려면 브라우저 컨트롤에 접근할 수 있어야 한다. 이제 실제 소스 코드를 보면서 분석해 보도록 하자.

<script language="javascript">
functionieExecWB( intOLEcmd, intOLEparam )
{
// 웹 브라우저 컨트롤 생성
var WebBrowser = '<OBJECT ID="WebBrowser1" WIDTH=0 HEIGHT=0 CLASSID="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';
 
// 웹 페이지에 객체 삽입
document.body.insertAdjacentHTML('beforeEnd', WebBrowser);
 
// if intOLEparam이 정의되어 있지 않으면 디폴트 값 설정
if ( ( ! intOLEparam ) || ( intOLEparam < -1 )  || (intOLEparam > 1 ) )
        intOLEparam = 1;
 
// ExexWB 메쏘드 실행
WebBrowser1.ExecWB( intOLEcmd, intOLEparam );
 
// 객체 해제
WebBrowser1.outerHTML = "";
}
 
</script>
 
<input type=button value="인쇄 미리 보기" onclick="window.ieExecWB(7)">  
<input type=button value="페이지 설정" onclick="window.ieExecWB(8)">  
<input type=button value="인쇄하기(대화상자 표시)" onclick="window.ieExecWB(6)">  
<input type=button value="인쇄 바로 하기" onclick="window.ieExecWB(6, -1)">

위의 소스 코드에서 웹 브라우저 컨트롤에 접근하기 위해 <object> 태그를 사용하였다. 이 때 웹 브라우저 컨트롤의 고유 클래스 ID인 "8856F961-340A-11D0-A96B-00C04FD705A2"를 사용하였다. ActiveX 프로그래밍을 해본 사람이라면 이게 무엇을 의미하는지 쉽게 알 수 있겠지만 잘 모르는 사람도 이 기능을 사용하는데는 큰 문제가 없다. 다만 궁금한 사람들은 레지스트리의 HKEY_CURRENT_USER의 CLSID 부분에서 {8856F961-340A-11D0-A96B-00C04FD705A2}을 찾아보기 바란다. 이렇게 레지스트리에 등록되어 있는 고유 ID를 <object> 태그를 통해 접근함으로써 해당 컨트롤의 기능을 이용할 수 있는 것이다.

웹 브라우저 컨트롤은 ExecWB란 메쏘드를 가지고 있다. 이 메쏘드를 통하여 브라우저 메뉴를 접근할 수가 있다. ExecWb 메쏘드의 파라미터로 intOLEcmd와 intOLEparam을 사용하는데 intOLEcmd가 7이면 인쇄 미리 보기, 8이면 페이지 설정, 6이면 인쇄하기이다. 인쇄하기 경우 intOLEparam이 -1이면 대화 상자 없이 바로 인쇄를 한다. 여기서 ExecWB 메쏘드는 WebBrowser1을 통해 접근하였는데 이는 <object> 태그 안에서 웹 브라우저 컨트롤에 대한 이름으로 WebBrowser1을 사용했기 때문이다. 이 이름은 사용자가 임의로 지정해 주면 된다.

만일 인쇄하기와 관련된 전형적인 방법을 알고 싶은 사람은 다음 글을 참조 하기 바란다.

이 외에도 브라우저의 메뉴를 실행시킬 수 있는 방법으로 execCommand 메쏘드가 있는데 이와 관련된 글을 읽고 싶다면 다음 글을 참조하기 바란다.

---------------------------------------------------------------------------------------

 

ActiveX를 이용해서 프린트 하는 방법

 

인터넷 익스플러 5.5 버젼에서 WebBrowser Control을 이용하여 자바스크립트로 프린트 설정을
할수 있는 방법이 있었는데 5.5 이후버젼 부터는 MS사에서 많은 문제점 때문에 스크립트로
프린트를 제어할수 없게 했더군요.

MSDN에 사이트 참고한 내용 입니다.
Printing with the Internet Explorer WebBrowser Control
This sample is provided in conjunction with the MSDN Library article,
"Printing with the Internet Explorer WebBrowser Control."
Many developers who host the WebBrowser control want to print the control's contents programmatically.
This article discusses the options available in Microsoft Internet Explorer and reviews the most common problems.

그렇다고 웹에서 프린트를 할수가 없냐?  할수 있습니다.

ActiveX를 이용해서 프린트 하는 방법이 있습니다.http://bbogi.net이곳 주인장님이

ActiveX를 제작하셔서 예제와 VC++ 소스까지 올려놓았습니다.http://bbogi.net
참고하시구요. 여기서는 여백만 설정하는게 있는데 거기 소스보시면 가로로 출력할수 있는 해법을 찾을수 있습니다.
하지만 인증받지 않은 ActiveX로 만들고 나면 노란색 경고메세지가 뜨면서 컨포넌트를 설치하라는 메세지가 나와서 보기 않좋습니다.

이제 두번째 방법입니다.MeadCo ScriptX를 이용하는 방법입니다. MSDN사이트에서도 웹으로 프린트를 할려면 MeadCo ScriptX로 가면 해결책을 찾을수 있을거라고 하네요^^
아래는 소스 입니다. 우선 OBJECT를 선언합니다. 그리고 버튼을 클릭할때 printWindow() 함수를 호출하여 사용합니다. 소스에 주석을 달아 났으니 보면 이해될꺼에요. [예제보기]

<object id=factory style="display:none"
classid="clsid:1663ed61-23eb-11d2-b92f-008048fdd814"
codebase="http://www.meadroid.com/scriptx/ScriptX.cab#Version=6,1,429,14">
</object>

<script language="javascript">
function printWindow()
{
   factory.printing.header          = "This is MeadCo"; // 머리말을 설정합니다.
   factory.printing.footer          = "Printing by ScriptX 5.x"; // 꼬리말을 설정합니다.
   factory.printing.portrait        = false; // 세로로 출력할것인지 가로로 출력할것인지 설정합니다. true:세로 false:가로
   factory.printing.leftMargin      = 1.0;   // 좌측여백
   factory.printing.topMargin       = 1.0;   // 상단여백
   factory.printing.rightMargin     = 1.0;   // 우측여백
   factory.printing.bottomMargin    = 1.0;   // 하단여백
   factory.printing.copies          = 1;     // 한장만 출력하라는뜻
   factory.printing.printBackground = true;  // 백그라운드까지 출력
   factory.printing.Print(true, window);     // 현재윈도를 프린트하는뜻(window대신에 frame을 지정해주면 해당 프레임을 출력합니다.)

}
</script>


이밗에도 인쇄미리보기,수없이 많은 기능들이 있더군요.
프린트 출력하는 곳이 상업적인 용도로 사용해야 하는 곳이면 라이센스도 생각해 보셔야 할꺼에요.

기타 다른 기술적인 부분에 대해서는MeadCo의Tech Docs부분을 참고하세요.

전 이 두가지 방법 모두다 사용해 보았습니다.

하지만 가장 마지막에 선택한것은 ^^ 인쇄버튼을 클릭하면 여백을 설정하는 화면과 가로로 출력하는 방법을 설명하는 페이지를 보여주는것을 선택했습니다. MeadCo ScriptX그렇게 비싸지는 않던데 구입하기도 귀찮고 클라이언트도 출력하는 방법을 보여주는 페이지를 보니까 그대로 잘 하더라구요.

 

자료출처

http://kin.naver.com/browse/db_detail.php?d1id=1&dir_id=10105&docid=523299

http://www.motifdn.pe.kr/aboutweb/aboutweb_script_24.php


'IT노트 > javaScript' 카테고리의 다른 글

자바스크립트_클립보드에 값 저장.  (0) 2015.03.04
자바스크립트 고급 꼭알아두자!  (0) 2015.03.04
뒤로가기 버튼 javascript:history.back(-1)  (0) 2015.02.25
Ajax jsonp OR 서버측에서 크로스도메인 허용 방법  (0) 2015.02.21
샘플 -basic _ popup.js  (0) 2015.02.20
Posted by wychoi
,

티스토리툴바