팝업창에서 부모창의 함수 호출 방법(opener)

팝업 기능을 이용해야 할 때가 가끔씩 아주 가끔씩 있다.

그런데 버튼 하나로 팝업창 작업 후 부모창도 어떤 작업을 수행하도록 구현하는게 좋을 때가 있다.

팝업창으로 사진을 올려서 저장시켰을 때 이미지가 바로 보여지게 한다거나, 리스트로 가게 한다거나 하는 것 처럼 말이다.

 

그러면 예시를 하나 만들어 보겠다.

부모창

var parentWindow;
 
function openCBAWindow(){ 
     parentWindow = window.open('', 'CbaWindow', 'width=410, height=450, resizable=0, scrollbars=no, status=0, titlebar=0, toolbar=0, left=300, top=200' ); 
    document.reqCBAForm.action = 'XXX.html'; 
    document.reqCBAForm.target = 'parentWindow'; 
    document.reqCBAForm.submit(); 
}
 
function testCheck(name, type){ 
    alert("name:"+name+ " | type:"+type); 
}

자식창

try{ 
    window.opener.testCheck('<%=name%>','');  
    self.close(); 
}catch(e){
   alert("E:"+e); 
} 

오픈 된 팝업 창 유무에 따른 처리 방법

var openerType = typeof opener.location.href;
 
if( openerType == 'string' ){
  opener.location.href='xxx.html';   //오픈된 팝업창인 경우 부모창(opener)의 페이지 이동
  opener.focus();
}else{
  window.open(page,'','');           //오픈된 팝업창이 아닌 경우 새 창 열기
}

부모창 > 팝업창1 > 팝업창2...;

opener.opener.form1.elements["seq"].value = seq;              //팝업창1.부모창.폼1.seq
opener.opener.form1.elements["name"].value = name; 
opener.opener.form1.elements["date"].value = date; 
window.close();            //현재화면(팝업2) 닫음 
opener.window.close(); //팝업1 닫음

자식 창에서 opener