iframe을 사용하는 경우 iframe을 가지고 있는 페이지를 부모, iframe의 페이지를 자식으로 정의할 수가 있습니다. 이경우 iframe에 정의된 페이지의 폼 값 또는 내용을 부모 페이지로 가져오는 방법에 대해 알아보겠습니다.
부모 페이지의 내용
<html>
<head>
<script language="javascript">
function getValue(){
var c='';
c = frames.one_child.frames.frm_child.name.value;
first.first_form.value = c;
}
</script>
</head>
<body>
<form name="first">
<input type="text" name="first_form">
</form>
<iframe src="child.html" name="one_child"></iframe>
<input type="button" value="값 가져오기" onClick="getValue();">
<body>
</html>
child.html의 내용
<html>
<head>
</head>
<body>
<form name="frm_child">
<input type="text" name="name">
</form>
</body>
</html>부모 페이지에서 "값 가져오기" 버튼을 누르면 child.html의 페이지를 iframe으로 불러와서 iframe의 name 폼에 입력된 값을 부모 페이지의 first_name 폼에다가 값을 넣는 이벤트입니다.
이때 frame을 지정을 해주어야하는데, 먼저 iframe의 frame을 정의하고 다음으로 iframe에 들어있는 페이지의 form 이름을 호출합니다.
frames.프레임이름.frames.페이지프레임명.폼이름.value;
→ frames.one_child.frames.frm_child.name.value;
이렇게 하면 부모 페이지에서 여러 iframe을 사용하더라도 해당 iframe의 폼 값 또는 내용을 가져올 수 있습니다.
'javascript' 카테고리의 다른 글
| 팝업창 전체화면으로 띄우는 3가지 방법 (0) | 2022.11.04 |
|---|---|
| jquery checkbox 체크박스 모두 선택 해제 (0) | 2022.11.02 |
| jquery를 이용한 테이블 열병합 rowspan (0) | 2022.11.01 |
| 외국인 등록번호 체크 로직 (0) | 2022.10.28 |
| 웹페이지 이전페이지 뒤로가기 비활성화 (0) | 2022.10.27 |
댓글