My Programing/HTML and JavaScript

JS :: 프레임을 나누어 사이트 출력

nkdk 2008. 6. 16. 10:14

  • <Form>
    입력양식을 처리합니다.
    • reset() : 양식을 초기화합니다.
    • submit() : 입력한 내용을 서버로 전송합니다.
    • action : 전달할 URL주소를 설정합니다.
    • elements : 폼양식을 배열로 저장하고 있으므로 해당양식의 값을 반환합니다.
    • length : 양식의 총갯수를 반환합니다.
    • name : 폼의 이름을 설정/반환합니다.
    • method : 입력내용의 전달방법을 결정합니다. get이나 post를 설정합니다.
    • target : 내용을 전달할 해당프레임을 설정합니다.

onchange는 이벤트의 한 종류로 입력양식의 내용이 바뀌었을 때 발생됩니다.

<html>

<frameset rows="50,*">
<frame src="top.htm" scrolling="no">
<frame src="bottom.htm" name="main">
</frameset>

</html>

<!-- bottom.htm _하단에 기본적으로 나타낼 문서입니다. -->

<html>
<body>
::: 해당내용이 출력됩니다. :::
</body>
</html>

<!-- top.htm _상단에 나타낼 프레임입니다. -->

<html>
<script language="JavaScript">
<!--

function sel_item() {
var myindex = fm.myselect.selectedIndex;
document.fm.action = fm.myselect.options[myindex].value;
document.fm.target = "main";  // 내용이 바뀔 프레임의 이름을 설정합니다.
document.fm.submit();  // 사용자가 선택한 정보를 전송합니다.
}

// -->
</script>
<body>
<form name="fm">
<select name="myselect" onchange="sel_item()">
  <option value="bottom.htm">선택하세요</option>
  <option value="http://www.naver.com">네이버</option>
  <option value="http://www.daum.net">다음</option>
  <option value="http://www.empas.com">엠파스</option>
</select>
</form>

</body>
</html>