[javascript] 부모창과 자식창의 값 전달 window.opener

window.open()을 이용하여 새창을 띄울 수 있으며, window.opener를 이용하여 부모창을 제어할 수 있습니다.

단, 도메인이 같아야 스크립트가 정상 작동합니다.

 

 

부모창 script

const childOpenWindow;

// 자식 창 오픈
function openWindow() {
	window.name = 'parentForm';
	childOpenWindow = window.open(url, windowName, [windowFeatures]);
}

// 자식에게 값 전달
function sendChildText() {
	childOpenWindow.document.getElementById("text").value = document.getElementById("text").value; 
}

 

 

자식창(새창) script

// 부모창에 값 전달
function setParentText() {
	window.opener.document.getElementById("text").value = document.getElementById("text").value;
}

// 부모창의 값 조회
function getParentText() {
	document.getElementById("text").value = window.opener.document.getElementById("text").value;
}

// 부모창의 function 호출
function callParentFunction() {
	window.opener.callParentFunction();
}

// 부모창 새로고침
function reloadParent() {
	window.opener.location.reload();
	// opener.parent.location=’부모창주소(원하는주소)’;
	window.close(); // 종료
}

 

 

[Reference]

https://developer.mozilla.org/ko/docs/Web/API/Window/opener

Window.opener - Web API | MDN