[Javascript] window.open 팝업

window.open 설명 : https://www.w3schools.com/jsref/met_win_open.asp

window 객체 설명 (코딩의 시작) : http://www.tcpschool.com/javascript/js_bom_window

* Center로 띄우기

var popWidth = 495;         var popHeight = 372;         var popLeft = (screen.width / 2) - (popWidth / 2);         var popTop = (screen.height / 2) - (popHeight / 2); /* window.screenLeft / window.screenTop window.screenX / window.scrrenY var scnLeft = window.screenLeft ? window.screenLeft : window.screenX; var scnTop = window.screenTop ? window.screenTop : window.screenY; screenLeft / screenTop 은 브라우저 Left / Top이 왼쪽으로부터 얼마나 떨어져 있는지 값이다. 듀얼 스크린인 경우 첫번째 스크린은 왼쪽부터 떨어져 있는 px이고 두번째 스크린은 첫번째 스크린으로부터 떨여져 있는 px 값이다. center로 맞출 때는 해당 값을 사용하면 현재 브라우저의 가운데로 위치하게 된다. */         var options = 'width=' + popWidth + ',height=' + popHeight + ',left=' + popLeft + ',top=' + popTop + ',location=no,menubar=no,resizable=no,status=no,toolbar=no';         window.open(mobileUrl, 'mobileAppDownload', options);

===================================================================================================================================

팝업 (자식창) 에서 호출한 페이지 (부모창) 닫기



출처 : http://blog.naver.com/PostView.nhn?blogId=innoc99&logNo=140055334056

우선 JavaScript의 Window객체에는 Open()과 Close()라는 함수가 있다..

각각의 함수는 (다들 아시겠지만) 이름대로 브라우저 창을 열고 닫아 주는 역할을 한다.

Open()함수는 여기서 주가 아니므로 간단히 예만 보고 넘어가도록 하자..

 

window.open("b.html","_blank","direction=yes, location=yes, menubar=yes, scrollbars=yes, status=yes,                           toolbar=no, resizeble=no, width=300, height=300");

 

이런 형태로 사용한다. 각각의 파라메터는 생략가능하다.

 

문제는 close()함수인데.. 사실 클로즈 함수 자체는 어려울게 없다. 대상윈도우에다가 사용하면 된다..예를 들어..

 

자기 자신을 닫을 때는  window.close();  self.close();  close();  중에 하나..    팝업이나 Open된 창에서 부모창을 닫을 때는  window.opener.close();  opener.close();  등등을 사용하면 된다.

 

여기서 발생하는 문제가 Close()함수를 호출하면 창을 닫을 것인지 다이얼로그창으로 물어본다는것이다.

보통 Close()를 사용할때 물어보길 원할때도 있지만 대부분은, 조용히 닫혀지기를 원한다.  이때 사용가능한 편법이 있다..

닫혀지는곳의 opener를 닫혀지는곳 자신이나, null, ""등의 값으로 설정하면된다.. 말이 좀 어렵다.. 직접 보도록하자..

 

자기자신을 닫을 때는 self.opener = self; 혹은 self.opener = null; 한 후 self.close()를 하면 된다..   반대로 팝업이나 Open된 창에서 부모창을 닫을 때는 부모창을 a.html 자식창을 b.html이라고 할때 a.html에서 self.opener = self; 혹은 self.opener = null; 을 설정한 후 오픈된 b.html에서 opener.close()를 호출하면 된다.

 

사실 좀 복잡할지 모르지만 한두번 해보면 금방익숙해 진다.

그런데.. 문제가 하나있다.. MS가 바보가 아니라.. 이편법을 IE7에서는 막아버렸다. 자식이 부모를 맘대로 죽이는(?) 하극상을 못참았나보다.

이방법을 사용해도 메시지 박스가 뜬다.. 하지만, 막는자가 있으면 뚫는자도 있는법.. 매우 참신한 방법으로 이 방법을 해결할 수있다..

 

 자기자신을 닫을 때는

 window.open("about:blank","_self").close();

 자기 자신에 윈도우를 하나열어서 자기 자식윈도우로 만든다음에 바로 닫아버린다.

 

 그렇다면 반대로 팝업이나 Open된 창에서 부모창을 닫을 때는 어떻게 할까..

  간단하다..

  opener.open('about:blank','_self').close();

  부모창에다 열고 닫아버리면 된다...