jQuery UI removeClass
jQuery UI removeClass
jQuery removeClass()方法用于管理jQueryUI视觉效果。它从元素中删除应用的类。
removeClass()方法在将所有样式更改设为动画时，将指定的类删除到匹配的元素。
语法:
以下是jQueryUI的基本语法removeclass()方法:
(在jQueryUI 1.0版中添加)
(在jQueryUI 1.0版中添加)
.removeClass( className [, duration ] [, easing ] [, complete ] )
removeClass()方法的参数:
ClassName: 这是一个包含一个或多个CSS类的字符串。(如果有更多的CSS类，它们之间用空格隔开。)
duration: 用于指定持续时间(以毫秒为单位)。 0值会将元素直接带入新样式，而不会进行任何处理。默认值为400。
easing: 这是一个字符串类型，指示效果进行的方式。默认值为swing。
complete: 是每个元素的效果完成后的每个元素的回调方法。
jQuery removeClass方法的语法:(在1.9版中添加)
jQuery 1.9的新版本还支持children选项，该选项还将为后代元素设置动画。
语法:
.removeClass( className [, options ] )
1.9版中removeClass()方法的参数:
className: 这是一个包含一个或多个CSS类的字符串。(如果有更多的CSS类，它们之间用空格隔开。)
options:它用于指定所有动画设置。所有属性都是可选的。其可能的值为:
duration:这是一种数字或字符串，表示效果的持续时间。以毫秒为单位。值0将直接采用新样式的元素，而不会进行任何处理。其默认值为400。
easing:是一个字符串。它指定了效果进行的方式。默认值为swing。
complete:这是在为每个元素完成效果后为每个元素调用的回调方法。
Children:这是布尔类型，用于指定是否应将动画另外应用于匹配元素的所有后代。其默认值为false。
Queue:这是布尔类型或字符串类型，用于指定是否将动画放置在效果队列中。默认值为TRUE。
jQuery UI removeclass示例
让我们以一个示例来演示jQueryUI removeclass()
(传递单个类)
(传递单个类)
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery UI addClass Example</title>
<link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
<style>
.elemClass {
width: 300px;
height: 100px;
background-color: #76eec6;
}
.myClass {
font-size: 30px; background-color: #eed5b7; color: #0000ee;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
$('.button').click(function() {
if (this.id == "add") {
$('#animTarget').addClass("myClass", "fast")
} else {
$('#animTarget').removeClass("myClass", "fast")
}
})
});
</script>
</head>
<body>
<div id=animTarget class="elemClass">
Hello! bianchenghao6
</div>
<button class="button" id="add">Add Class</button>
<button class="button" id="remove">Remove Class</button>
</body>
</html>