위키
포럼
도구
바뀐글
랜덤

"JQuery .toggleClass()"의 두 판 사이의 차이

잔글 (봇: 자동으로 텍스트 교체 (-== 참고 자료 == +==참고==))
35번째 줄: 35번째 줄:
$(function() {
$(function() {
     $('#btn1').click(function() {
     $('#btn1').click(function() {
         $('#greet').toggleClass('highlight red');
         $('#greet').toggleClass('display none');
     });
     });
});
});

2019년 2월 13일 (수) 10:35 판

1 개요

jQuery .toggleClass()
  • 클래스를 토글(ON/OFF, 추가/삭제)하는 jQuery 메소드
  • 여러 클래스 동시에 토글 가능

2 예시 1

<style>
.highlight { background: yellow; }
#btn1 { width: 100px; height: 35px; }
</style>
<script src='//code.jquery.com/jquery.min.js'></script>
<script>
$(function() {
    $('#btn1').click(function() {
        $('#greet').toggleClass('highlight');
    });
});
</script>
    
<div id='greet'>안녕 친구들</div>
<br><button id='btn1'>토글 버튼</button>

3 예시 2

<style>
.highlight { background: yellow; }
.red { color: red; }
#btn1 { width: 100px; height: 35px; }
</style>
<script src='//code.jquery.com/jquery.min.js'></script>
<script>
$(function() {
    $('#btn1').click(function() {
        $('#greet').toggleClass('display none');
    });
});
</script>
 
<div id='greet' class='highlight red'>안녕 친구들</div>
<br><button id='btn1'>토글 버튼</button>

4 같이 보기

5 참고

원본 주소 "https://zetawiki.com/w/index.php?title=JQuery_.toggleClass()&oldid=490501"
문서 댓글 ({{ doc_comments.length }})
{{ comment.name }} {{ comment.created | snstime }}