바로가기 select option & radio 버튼을 하이퍼링크 연결 > 기술자료

• 목록
• 게시판 리스트 옵션
  • 검색

1. select 현재창 열기

1-1.  select 현재창열기  ( 작동: IE11, Edge, Chrome40, Firefox44, Safari5 )
<select name="hyper_select" onchange="location=''+this.value;">
  <option value="">바로가기</option>
  <option value="http://google.com">Google</option>
  <option value="https://www.happyjung.com">해피정닷컴</option>
</select>


1-2.  select 현재창열기  ( 작동: IE6, IE7, IE11, Edge, Chrome48, Firefox3~44, Safari5 )
<script type="text/javascript">
function hyper_select(url) {
    if (url.selectedIndex != 0) {
        location.href=url.options[url.selectedIndex].value;
    }
}
</script>
<select onChange="hyper_select(this)">
    <option value="">바로가기</option>
    <option value="http://google.com">Google</option>
    <option value="https://www.happyjung.com">해피정닷컴</option>
</select>


1-3.  select 현재창열기  ( 작동: IE6, IE7, IE11, Edge, Chrome48, Firefox3~44, Safari5 )
<select name="SearchStr" onChange="hyper_select(this);">
    <option value="">선택하세요</option>
    <option value="시사용어">시사용어</option>
    <option value="한글맞춤법">한글맞춤법</option>
    <option value="컴퓨터">컴퓨터</option>
</select>
<script>
function hyper_select(f) {
    location.href='change.html?SearchStr=' + f.value;
}
</script>



2.  select 새창열기

2-1.  select 새창열기 ( 작동: IE6, IE7, IE11, Edge, Chrome40~48, Firefox3~44  /  안됨: Safari5 )
<script type="text/javascript">
function hyper_select(w) {
    if (w.selectedIndex != 0) {
        url=w.options[w.selectedIndex].value;
        window.open(url,'_blank','')
    }
}
</script>
<select onChange="hyper_select(this)">
    <option value="">바로가기</option>
    <option value="http://google.com">Google</option>
    <option value="https://www.happyjung.com">해피정닷컴</option>
</select>


2-2. select 새창열기  ( 작동: IE11, Edge, Chrome48, Firefox44  /  안됨: Safari5 )
<select name="hyper_select" onchange="window.open(this.value)">
    <option value="">바로가기</option>
    <option value="http://google.com">Google</option>
    <option value="https://www.happyjung.com">해피정닷컴</option>
</select>



3.  radio 현재창열기

3-1.  radio 현재창열기  ( 작동: IE6, IE7, IE11, Edge, Chorme48, Firefox3~44, Safari5 )
<script type="text/javascript">
function hyper_radio(w) {
    location.href=w;
}
</script>
<input type="radio" onClick="hyper_radio('http://google.com')">Google
<input type="radio" onClick="hyper_radio('https://www.happyjung.com')">해피정닷컴


4.  radio 새창열기

4-1.  radio 새창열기  ( 작동: IE6, IE7, IE11, Edge, Chrome48, Firefox3~44, Safari5 )
<script type="text/javascript">
function hyper_radio(w) {
    url=w;
    window.open(url,'_blank','')
}
</script>
<input type="radio" onClick="hyper_radio('http://google.com')">Google
<input type="radio" onClick="hyper_radio('https://www.happyjung.com')">해피정닷컴



참고자료
http://www.taeyo.pe.kr/Forum/Content.aspx?SEQ=21730&TBL=JSCRIPT