여러개의 셀렉트 박스가 있을때 선택한 것을 제외하고
다른 것들의 상태를 초기화 시키는 예제입니다.
- 아래 셀렉트 박스를 이것 저것 선택해 보세요.
- 현재 선택한것을 제외하고 다른것의 상태가 초기화 됩니다.
등록일 : ,
셀렉트 박스 초기화 하기
CSS
.gogogo select {
width:120px;
padding:5px;
}
HTML
<div class="gogogo">
<select onchange="gogogo(this)">
<option value="">- 카테고리 -</option>
<option value="">MicroSD메모리</option>
<option value="">SD메모리</option>
<option value="">CF메모리</option>
<option value="">메모리스틱</option>
<option value="">XQD메모리</option>
</select>
<select onchange="gogogo(this)">
<option value="">- 브랜드 -</option>
<option value="">싼디스크</option>
<option value="">삼숭전자</option>
<option value="">트랜싼드</option>
<option value="">소닉</option>
<option value="">랙사</option>
<option value="">올바른전자</option>
<option value="">어른나비</option>
<option value="">도시바ㄹ</option>
<option value="">가프로</option>
</select>
<select onchange="gogogo(this)">
<option value="">- 혜택 -</option>
<option value="">무료배송</option>
<option value="">카드할인</option>
<option value="">쿠폰</option>
<option value="">적립</option>
<option value="">날가져요 엉엉</option>
</select>
</div>
자바스크립트
function gogogo(o){
$('option:first', $('.gogogo select').not(o)).prop('selected', true);
// $('.gogogo select') - gogogo 클래스 에서 select 찾기
// .not(o) - 찾은 것 중 현재것(클릭한것)을 제외하기
// $('option:first, - 찾은 select 들의 option 중 첫번째 것 찾기
// .prop('selected', true) - selected 를 적용해서 선택 상태로 해주기
}
방문해 주셔서 감사드립니다 !!