SELECT 객체 속성  

 

- size
1 : 콤보박스
2 : 리스트박스

<select name="sample" size="10">
..생략..
</select>

 

- multiple
복수 선택을 가능하게 한다.

<select name="sample" size="10" multiple>
..생략..
</select>

 

- selected
특정 항목을 선택된 상태로 만들 수 있다.

<select name="sample" size="1">
<option value="1">서울</option>
<option value="2" selected>경기</option>
<option value="3">부산</option>
</select>

 

- length
항목의 갯수를 리턴한다.

document.폼이름.객체이름.length

 

- selectedIndex
현재 선택된 항목의 index (선택된 항목이 없으면 -1)

document.폼이름.객체이름.selectedIndex

 

======================================================================== 

 

 OPTION 객체 속성 

 

- value : 해당 항목의 값
  document.폼이름.객체이름.options[첨자].value

 

- text : 해당 항목의 text 값 (리스트에 보이는 값)
  document.폼이름.객체이름.options[첨자].text

 

- selected : 현재 선택 여부 (true/false)
  document.폼이름.객체이름.options[첨자].selected

 

- defaultSelected : 초기 선택여부 (true/false)
  document.폼이름.객체이름.options[첨자].defaultSelected

 

========================================================================

 

 동적으로 항목 추가하기 

변수 = new Option(text값, value값);
document.폼이름.객체이름.options[추가할위치] = 변수;

 

 [응용] 맨끝에 항목 추가하기 

var idx = document.폼이름.객체이름.length;
var newOpt = Option("text값","value값");
document.폼이름.객체이름.options[idx] = newOpt;

 

 동적으로 항목 삭제 
document.폼이름.객체이름.options[삭제할위치] = null;

 

 [응용] 현재 선택된 항목 삭제 

var idx = document.폼이름.객체이름.selectedIndex;
if(idx>-1) document.폼이름.객체이름.options[idx] = null;