2012-04-20 4 views
1

4 가지 옵션이 있는데 둘 이상의 옵션을 선택하거나 두 번째 클릭으로 선택한 클래스를 제거 할 수 있기를 원합니다.Jquery first click addClass 두 번째 클릭 removeClass selected

jQuery를

$('.contact-method li a').click(function(e) { 
     $('.contact-method li a').removeClass('selected'); 
     $(this).parent('a').addClass('selected'); 
     e.preventDefault(); 
}); 

HTML

<ul class="contact-method"> 
<li class="sms"><a href="javascript:void(0);">SMS</a></li> 
<li class="telephone"><a href="javascript:void(0);">Telephone</a></li> 
<li class="email"><a href="javascript:void(0);">Email</a></li> 
<li class="post"><a href="javascript:void(0);">Post</a></li> 
</ul> 

데모 http://jsfiddle.net/XeELs/97/

답변

9

대신

방금 앵커 노드에서 선택한 클래스를 전환하고자하는 경우3210
$('.contact-method li a').removeClass('selected'); 
    $(this).parent('a').addClass('selected'); 

단순히

$(this).toggleClass('selected'); 
3

를 사용하려고 :

$('.contact-method li a').click(function(e) { 
    e.preventDefault();    
    $(this).toggleClass('selected'); 
}); 

http://jsfiddle.net/XeELs/99/

0

사용

toggleClass
$('.contact-method li a').click(function() { 
     $(this).toggleClass('selected'); 
});