2013-03-26 14 views
14

Korzystanie z jQuery, jak mogę włączyć ClassA do ClassB na kliknięcia dzieje z:jQuery onclick nazwę przełącznik klasy

<a class="switch" href="#">Switch</a> 
<div class="classA"></div> 


$('.switch').on('click', function(e){ 
    $('.classA').removeClass('classA').addClass('classB'); 
    e.preventDefault(); 
}; 

Jak mogę przełączyć klasę, a nie tylko zastąpienie go jak ja tutaj robię?

Odpowiedz

43

jQuery ma toggleClass funkcję:

<button class="switch">Click me</button> 

<div class="text-block collapsed pressed">some text</div> 

<script>  
    $('.switch').on('click', function(e) { 
     $('.text-block').toggleClass("collapsed pressed"); //you can list several class names 
     e.preventDefault(); 
    }); 
</script> 
17

you can usetoggleClass() aby przełączyć klasę to jest naprawdę przydatny.

przypadku: 1

<div id='mydiv' class="class1"></div> 

$('#mydiv').toggleClass('class1 class2'); 

output: <div id='mydiv' class="class2"></div> 

przypadku: 2

<div id='mydiv' class="class2"></div> 

$('#mydiv').toggleClass('class1 class2'); 

output: <div id='mydiv' class="class1"></div> 

przypadku: 3

<div id='mydiv' class="class1 class2 class3"></div> 

$('#mydiv').toggleClass('class1 class2'); 

output: <div id='mydiv' class="class3"></div>