Javascript

[Javascript] 부모창에서 자식창으로 값 전달하기 opener

chsr 2022. 3. 29. 10:35
728x90
반응형

 Javascript 부모창에서 자식창으로 값 전달하기

부모창에서 자식창, 팝업창을 띄울 수 있음
이 때, 팝업창을 띄우는 창은 부모창, 팝업창은 자식창이 됨
부모창과 자식창 간 서로 데이터 즉, 특정 값을 주고받을 수 있음


■ 부모창 → 자식창

1. 부모창에서 자식창(팝업창) 열기

var child;
var url = "./popup_child.php";
child = window.open(url, 'popup_child', 'menubar=no, scrollbars=yes, status=yes, resizable=auto, titlebar=no, hotkey=0, width=300, height=300, left=0, top=0);

 

2. 부모창에서 자식창(팝업창) 닫기

child.close();

 

3. 부모창에서 자식창(팝업창) 데이터 값 전달하기 (하기 코드는 자식창(팝업창)에 넣어줘야 함)

// 부모창에서 id가 parent_val인 요소(태그)의 값 가져오기
var parent_val = opener.$("#parent_val").val(); 

// 자식창(팝업창)에서 id가 child_val인 요소(태그)의 값에 부모창에서 가져온 값 넣기
$("#child_val").val(parent_val);

 자식창 → 부모창

1. 자식창(팝업창)에서 부모창으로 값 전달하기 (하기 코드는 부모창에 넣어줘야함)

var child_val = $("#child_val").val();
$("#parent_val", opener.document).val(child_val);

 

2. 자식창에서 부모창 내 함수 호출

// 자식창(팝업창)에서 부모창에 있는 parent_func 라는 함수를 호출
$(opener.location).attr("href", "javascript:parent_func();");
728x90
반응형