YesYo.com MintState Forums  
뒤로    YesYo.com MintState BBS > Tech > Javascript
검색
멤버이름  오토
비밀번호 
 

 
작성일 : 10-07-23 11:43
Select 객체 추가 삭제
 글쓴이 : MintState
조회 : 7,205  
Select 객체 추가 삭제

가끔씩 select의 객체를 컨트롤할 경우가 있죠.
아래 예제를 참고 하시면 될것 같습니다.

<html>
<head>
<title> select 객체 예제 </title>
<script language="JavaScript">
var job = new Array("고등학생","대학생","대학원생","회사원","교수","정당인")
function test() {
	var str="리스트 원소의 갯수는 "
	str += document.myform.job.options.length
	str += "\n"
	str += "선택한 값은\n"
	str += document.myform.job.options.selectedIndex
	str += "\n"
	str += document.myform.job.value
	alert(str)
}
function sAdd(srcList, nTxt, nTxt2) {
	if(nTxt != "") {
		new_option = new Option(nTxt,nTxt2);
		srcList.options.add(new_option,0);
		alert(nTxt+"를 추가하였습니다");
	}
}

function sDel(srcList){
	for( var i =0; i < srcList.options.length ; i++ ) { 
		if ( srcList.options[i] != null && ( srcList.options[i].selected == true ) ) {
			alert(srcList.options[i].text + "를 삭제하였습니다");
			srcList.options[i] = null;
		}
	}
}

function sDel2(srcList){
	// Select Box all delete
	for( var i = srcList.options.length ; i >= 0; i-- ) { 
		srcList.options[i] = null;
	}
}
</script>
</head>
<body>
당신의 직업을 선택하세요.
<form name="myform">
<select name="job" size=4>
	<option value="고등학생" selected> 고등학생
	<option value="대학생"> 대학생
	<option value="대학원생"> 대학원생
	<option value="회사원"> 회사원
	<option value="교수"> 교수
	<option value="정당인"> 정당인
</select>
<input type="button" value="확인" onClick="test()">
<input type="button" value="삭제" onclick="sDel( this.form.job)">
<input type="button" value="모두삭제" onclick="sDel2( this.form.job)">
<br>
직업 명 : <input type='textbox' name='ntxt' value=''> text <br>
직업 키 : <input type='textbox' name='ntxt2' value=''> value &nbsp;
<input type="button" value="추가" onclick="sAdd(this.form.job, this.form.ntxt.value, this.form.ntxt2.value)">
</form>
</body>
</html>
Rated 5.0/5 (100%) (1 Votes)

(\__/)
(='.'=)
(")_(")~
Search Infomation by MintState
MintState

 
 

Total 173
번호 제   목 글쓴이 날짜 조회
173 GIF 플레이어(제어) MintState 09-26 78
172 youtube ID 값 추출 MintState 03-08 512
171 Javascript - 비밀번호 유효성 검사(password validation) MintState 11-14 936
170 하단고정레이아웃 MintState 07-01 1064
169 highcharts MintState 03-05 2099
168 jQuery Masonry 갤러리 리스트 효과 MintState 11-19 3148
167 파이어폭스, IE에 모두 적용되는 iframe 태그 MintState 04-11 8391
166 롤링 위 아래 버튼 적용 MintState 04-06 6290
165 Select 객체 추가 삭제 MintState 07-23 7206
164 숫자에 컴마(,) 쓰고 한글로 숫자 표시 MintState 06-09 6774
163 object 속성보기 MintState 04-29 9026
162 비밀번호 보안등급 체크 (2) MintState 04-29 10039
161 기본 공통 스크립트 MintState 04-16 7510
160 textarea에 줄바꿈 금지와 글자수 제한 MintState 02-17 13458
159 JSON 객체를 String으로 변환하기 MintState 01-19 13872
158 Tooltip 풍선 도움말 MintState 10-27 9590
157 다중 셀렉트 기본 방법 MintState 10-23 7876
156 자바스크립트를 이용한 암호화 MintState 09-01 9039
155 모든 자바스크립트 에러 잠재우기 (에러 디버그) MintState 05-13 8326
154 레이어 팝업 (2) MintState 04-24 8053
 1  2  3  4  5  6  7  8  9  
모바일 버전으로 보기
CopyRight ©2004 - 2017, YesYo.com MintState. ™