[javascript] select option 홈페이지 이동기능

<select name="" id="scltList" title="포털 리스트">
 
<option value="x" selected="selected" id="slct">--선택--</option>
<option value="http://www.naver.com">네이버</option>
<option value="http://www.google.co.kr/">구글</option>
<option value="http://www.daum.net/">다음</option>
 
</select>
        

<script type="text/javascript">
 
/* select tab function */
var selectTab = document.getElementById("scltList"); // 셀렉트를 변수에 저장
    
selectTab.addEventListener("change",function(){ // change 이벤트 발생
 
    var val = selectTab.options[selectTab.selectedIndex].value; // option value값 저장
 
    if(val != "x" ){ // value값이 x가 아닐 때 
 
    window.open(val); // 새 창으로 홈페이지 띄움
        
    document.getElementById("slct").selected = true; // 선택한 옵션을 제일 처음으로 바꿔줌.    
 
    }    
    
});
    
</script>

 

셀렉트를 이용하여 홈페이지를 이동시키는 기능입니다.

1. 셀렉트 내 옵션을 선택 할 때 value값이 x가 아니면 

    window.open을 이용하여 새 창으로 url로 이동

2. 이동 후 제일 첫번째 옵션으로 재선택됨