2013-03-26 16 views
14

Mit jQuery, wie kann ich classA zu classB auf Klick wechseln gehen aus:jQuery Onclick Toggle-Klassennamen

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


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

Wie kann ich die Klasse wechseln, statt nur ihn zu ersetzen, wie ich hier bin?

Antwort

43

jQuery hat eine toggleClass Funktion:

<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() Klasse zu wechseln ist wirklich praktisch.

Fall: 1

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

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

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

Fall: 2

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

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

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

Fall: 3

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

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

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