jQuery onclick 切换类名
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/15627955/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-26 15:27:08 来源:igfitidea点击:
jQuery onclick toggle class name
提问by cusejuice
Using jQuery, how do I toggle classA to classB on click going from:
使用 jQuery,我如何在点击时将 classA 切换到 classB:
<a class="switch" href="#">Switch</a>
<div class="classA"></div>
$('.switch').on('click', function(e){
$('.classA').removeClass('classA').addClass('classB');
e.preventDefault();
};
How do I toggle the class, instead of just replacing it like I'm doing here?
我如何切换课程,而不是像我在这里做的那样简单地替换它?
回答by Matt Zeunert
jQuery has a toggleClassfunction:
jQuery 有一个toggleClass函数:
<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>
回答by Arun Pratap Singh
you can usetoggleClass()
to toggle class it is really handy.
你可以toggleClass()
用来切换类它真的很方便。
case:1
情况1
<div id='mydiv' class="class1"></div>
$('#mydiv').toggleClass('class1 class2');
output: <div id='mydiv' class="class2"></div>
case:2
案例:2
<div id='mydiv' class="class2"></div>
$('#mydiv').toggleClass('class1 class2');
output: <div id='mydiv' class="class1"></div>
case:3
案例:3
<div id='mydiv' class="class1 class2 class3"></div>
$('#mydiv').toggleClass('class1 class2');
output: <div id='mydiv' class="class3"></div>