상세 컨텐츠

본문 제목

select box 고정하기

JavaScript & HTML

by husks 2014. 5. 22. 16:38

본문

반응형


셀렉트 박스 고정 관련 소스 입니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!doctype html>
<html lang="ko">
    <head>
        <meta charset="utf-8">
        <title>setInterval Test</title>
        <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script>
            
            $( document ).ready( function() {
                
                $('#button2').hide();//고정 해제 버튼 비활성화
                
                $("[id*=button]").click(function(){//button이란 명으로 like 검색
                    
                    if($(this).attr('value')=="Y"){//고정
                        $("#selectType option").not(":selected").attr("disabled""disabled");//selectbox 고정
                        $('#button1').hide();
                        $('#button2').show();
                    }else{//해제
                        $("#selectType option").not(":selected").removeAttr("disabled");//selectbox 고정 해제
                        $('#button1').show();
                        $('#button2').hide();
                    }
                    
                });
          
            });
        </script>
    </head>
    <body>
        <select id="selectType">
            <option value="톨스토이">톨스토이</option>
            <option value="허균">허균</option>
            <option value="빅토르 위고">빅토르 위고</option>
        </select>
      <button id="button1" value="Y"> 고정 </button>
      <button id="button2" value="N"> 고정 해제 </button>
        </body>
</html>



반응형

관련글 더보기

댓글 영역