使用jquery函数添加/删除类

时间:2012-05-18 18:42:47

标签: javascript jquery class function

我有这个代码。

CSS

body {
    font-family:Verdana, Geneva, sans-serif;
    font-size:14px;
}

.slidingDiv {
    height:300px;
    background-color: #99CCFF;
    padding:20px;
    margin-top:10px;
    border-bottom:5px solid #3399FF;
}

.show_hide {
    display:none; 
}

HTML

<a href="#" class="show_hide">Show/hide</a>
<br />
<div class="slidingDiv">
    Fill this space with really interesting content.
    <a href="#" class="show_hide">hide</a>
</div>

JS

$(document).ready(function(){
    $(".slidingDiv").hide();
    $(".show_hide").show();
    $('.show_hide').click(function(){
        $(".slidingDiv").slideToggle();
    });
});

有人告诉我是否有可能添加这个jquery函数,如果我点击它,同时显示/隐藏一个新div,将类更改为标记并从另一个标记中删除另一个类?我该怎么办?

感谢。

4 个答案:

答案 0 :(得分:6)

是的,你可以看一下方法addClass以及removeClass

答案 1 :(得分:5)

删除jQuery('element').removeClass('class'); reference
添加jQuery('element').addClass('class'); reference

您可以使用toggleClass切换。
切换jQuery('element').toggleClass('class otherClass'); reference

答案 2 :(得分:3)

添加课程:

$('selector').addClass('className');

删除课程:

$('selector').removeClass('className');

答案 3 :(得分:1)

是的,你当然可以添加或删除类

<script type="text/javascript">
$("#ButtonId").click(function () {
    $('#itemid').removeClass('classname');
    $('#itemid').addClass('classname');
});
</script>