728x90
반응형
부모창과 자식창의 관계를 여러가지가 있습니다.
첫번째로는 가장 많이 사용되는 팝업이 있습니다. 팝업에서 팝업으로 띄워지는 창이 자식창이고 팝업을 띄우기 위해 클릭되어지는 버튼이 있는 창이 부모창이 되겠지요
두번째로는 아이프레임이 있지요! iframe태그가 있는 창이 부모창, iframe에 의해 불려지는 창이 자식창이 있습니다.
마지막으로 frameset과 frame으로 이루어 지는 것이 있겠지요!!
각각의 상황에 따라 자식창에서 부모창에 있는 자바스크립트를 핸들링하는 방법을 알아보겠습니다!!
1. 팝업
<script>
opener.parent.함수명();
</script>
2. 아이프레임
<script>
top.함수명();
</script>
3. frameset
parent.frames["프레임이름"].함수명();
3번의 경우는 약간 헷갈릴 수 있으니 예제를 보여드리겠습니다.
아래의 소스를 가지는 frameset.html 파일이 있다고 가정해봅시다!
<frameset cols="200,*">
<frame src="top.html" name="page_top">
<frame src="contents.html" name="page_contents">
</frameset>
그리고 top.html의 소스는 다음과 같습니다.
<html>
<head>
<script>
function write_page()
{
alert;("TOP페이지의 write_page함수를 사용하셨습니다");
}
</script>
<body>
TOP 페이지입니다
</body>
</html>
마지막으로 contents.html 소스는 다음과 같습니다.
<html>
<head>
<script>
function connect_top_function()
{
parent.frames["page_top"].write_page();
}
</script>
</head>
<body>
컨텐츠 페이지입니다! <br/>
<span style='cursor:hand' onclick='connect_top_function()'>[TOP페이지 함수 호출]</span>
</body>
</html>
728x90
반응형
'JAVASCRIPT > 소스코드' 카테고리의 다른 글
| HTML에서 input박스에 글자 입력시 Byte체크 (0) | 2014.09.16 |
|---|---|
| 입력된 글자의 Byte 를 보여주는 스크립트 (0) | 2014.09.16 |
| JAVASCRIPT_[ 자료형 검사시 유의사항(typeof / constructor) ] (0) | 2014.09.11 |
| jQuery - 요소가 존재하는지 여부 확인 (0) | 2014.09.05 |
| jQuery API: Manipulation, Events, Effects, Internals, Utilities (0) | 2014.08.19 |
| javascript indexOf 함수, lastIndexOf 함수, 문자열, array 특정 위치값 가져오기 (0) | 2014.08.19 |
| 자바스크립트 for문으로 변수 생성 (0) | 2014.08.08 |
| javascript for문 (0) | 2014.08.08 |
nineDeveloper
안녕하세요 현직 개발자 입니다 ~ 빠르게 변화하는 세상에 뒤쳐지지 않도록 우리모두 열심히 공부합시다 ~! 개발공부는 넘나 재미있는 것~!