hahahia

실습2 본문

Web Programming/JavaScript

실습2

hahahia 2012. 3. 28. 12:27

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

 <head>

  <title> New Document </title>

  <meta name="Generator" content="EditPlus">

  <meta name="Author" content="">

  <meta name="Keywords" content="">

  <meta name="Description" content="">

  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

 </head>

<script type="text/JavaScript">

function changeSub()

{

bigObj = document.getElementById("big");

var subMenu;

switch(bigObj.selectedIndex)

{

case 0 : subMenu = ["소나타", "아반떼", "K5", "K9"];

break;

case 1 : subMenu = ["pc", "tablet pc", "smart phone"];

break;

case 2 : subMenu = ["청바지", "타이즈", "티셔츠"];

break;

}

// 기존 목록상자의 내용 제거

var medObj = document.getElementById("med");

for(i=medObj.length; i>=0; i--)

{

medObj.remove(i);

}

// 새롭게 정의한 내용 추가

for(i=0; i<subMenu.length; i++)

{

var newnode = document.createElement("OPTION");

newnode.innerText = subMenu[i];

medObj.appendChild(newnode);

}

}

</script>

 <body>

 <SELECT id="big" onChange="changeSub()">

 <OPTGROUP label="대분류">

 <OPTION value="자동차">자동차</OPTION>

 <OPTION value="컴퓨터">컴퓨터</OPTION>

 <OPTION value="옷">옷</OPTION>

 </SELECT>

 <SELECT id="med">

 <OPTGROUP label="중분류">

 </SELECT>

 </body>

</html>

'Web Programming > JavaScript' 카테고리의 다른 글

Javascript를 이용한 문자열 길이체크 및 입력제한  (0) 2012.04.04
실습 01  (0) 2012.03.28
JavaScript를 이용한 계산기 프로그램  (0) 2012.03.23
JavaScript를 이용한 BMI 지수 측정 소스코드  (0) 2012.03.14
JavaScript(alert, write, prompt)  (0) 2012.03.14
'Web Programming/JavaScript' Related Articles more
Comments