고똘이의 IT 개발이야기

안녕하세요.


오늘은 자바스크립트를 이용하여 input의 show/hide에 대해서 알아 보겠습니다.

주석은 아래의 소스에 적어 두겠습니다.

 

1. show() 처리

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<input type="button" value="보인다/안보인다" id="showHide" >
<input type="text" value="테스트입니다." id="test" >
 
<script>
 
    // showHide라는 id를 가진 버튼을 클릭 할 경우 
    // test라는 id를 가진 input를 안보이게 hide 처리 합니다.
    $("#showHide").click(function(){
        $("#test").hide();
    });
 
</script>
 
 
 

 

 

2. hide() 처리

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<input type="button" value="보인다/안보인다" id="showHide" >
<input type="text" value="테스트입니다." id="test" >
 
<script>
 
    // showHide라는 id를 가진 버튼을 클릭 할 경우 
    // test라는 id를 가진 input를 안보이게 show 처리 합니다.
    $("#showHide").click(function(){
        $("#test").show();
    });
 
</script>
 
 
 

 

감사합니다.

 

유용하셨다면 좋아요와 댓글 하나 적어주시면 감사하겠습니다.

이 글을 공유합시다

facebook twitter googleplus kakaoTalk kakaostory naver band