제이쿼리 .hasClass('on'); .removeClass('on'); .addClass('on');
페이지 정보
본문
---------- CSS ----------------
<style>
ul { list-style:none; }
button { width:100px; height:50px; }
button.on { border: 5px solid red; }
</style>
-------------- HTML ---------------
<ul id="sample">
<li><button class="on">1</button></li>
<li><button>2</button></li>
<li><button>3</button></li>
<li><button>4</button></li>
</ul>
------------------ JS ----------------
$("#sample>li>button").click(function(e){
e.stopPropagation();
if( !$(this).hasClass("on") ){
$("#sample>li>button.on").removeClass("on");
$(this).addClass("on");
}
});
관련링크
- 이전글제이쿼리 - 선택자, 이벤트핸들러, 속성, 메소드 모음 15.01.29
- 다음글event.stopPropagation(), event.preventDefault() 15.01.29
댓글목록
등록된 댓글이 없습니다.
