×
jQuery UI 教程jQuery UI 简介jQuery UI 下载jQuery UI 使用jQuery UI 定制jQuery UI 工作原理

jQuery UI 主题

jQuery UI 主题jQuery UI ThemeRollerjQuery UI CSS 框架 APIjQuery UI 设计主题

jQuery UI 部件库

jQuery UI 部件库jQuery UI 扩展小部件jQuery UI 小部件方法调用jQuery UI 为何使用部件库jQuery UI 如何使用部件库

jQuery UI 参考手册

jQuery UI API 文档API 类别 – 特效API 类别 – 特效核心API 类别 – 交互API 类别 – 方法重载API 类别 – 方法API 类别 – 选择器API 类别 – 主题API 类别 – UI 核心API 类别 – 实用工具API 类别 – 小部件

jQuery UI 实例

jQuery UI 实例拖动(Draggable)放置(Droppable)缩放(Resizable)选择(Selectable)排序(Sortable)折叠面板(Accordion)自动完成(Autocomplete)按钮(Button)日期选择器(Datepicker)对话框(Dialog)菜单(Menu)进度条(Progressbar)滑块(Slider)旋转器(Spinner)标签页(Tabs)工具提示框(Tooltip)特效(Effect)显示(Show)隐藏(Hide)切换(Toggle)添加 .addClass()移除 .removeClass()切换 .toggleClass()转换 .switchClass()颜色动画(Color Animation)定位(Position)部件库(Widget Factory)

jQuery UI API - .removeClass()


jQuery UI API 类别 – 特效核心jQuery UI API 类别 – 特效核心


所属类别

特效(Effects) | 特效核心(Effects Core) | 方法重载(Method Overrides)

用法

描述:当动画样式改变时,为匹配的元素集合内的每个元素移除指定的 Class。

返回:jQuery

.removeClass( className [, duration ] [, easing ] [, complete ] )

参数 类型 描述 默认值
className String 要从每个匹配的元素的 class 属性中移除的一个或多个 class 名称,多个 class 名称用空格分隔 。
duration Number 或 String 一个字符串或一个数字,指定动画将运行多久。 400
easing String 一个字符串,指示要使用的 easing 函数。 swing
complete Function() 一旦动画完成时要调用的函数。

.removeClass( className [, options ] )

参数 类型 描述
className String 要从每个匹配的元素的 class 属性中移除的一个或多个 class 名称,多个 class 名称用空格分隔 。
options Object 所有的动画设置。所有的属性是可选的。
  • duration(默认值:400
    类型:Number 或 String
    描述:一个字符串或一个数字,指定动画将运行多久。
  • easing(默认值:swing
    类型:String
    描述:一个字符串,指示要使用的 easing 函数。
  • complete
    类型:Function()
    描述:一旦动画完成时要调用的函数。
  • children(默认值:false
    类型:Boolean
    描述:指定动画是否被应用到匹配元素的所有后代。此功能应慎重使用,因为判断元素是否是动画的后代的代价是很大的,会根据后代的数量线性增长。
  • queue(默认值:true
    类型:Boolean 或 String
    描述:一个布尔值,指示是否将动画放在特效队列中。如果是 false,动画将立即开始。自 jQuery 1.7 起,queue 选项也接受一个字符串,在这种情况下,动画添加到由字符串表示的队列中。

与原生的 CSS 过渡相似,jQuery UI 的 class 动画提供了一个平稳的从一个状态转换到另一个状态的过渡,同时确保所有样式变化的细节是通过 CSS 来完成的,而不需要使用 JavaScript。所有的 class 动画方法,包括 .removeClass(),允许自定义动画持续时间和 easing 函数,在动画完成时也提供了一个回调。

并非所有的样式都可以进行动画添加。例如,对背景图像进行动画化。任何不能动画化的样式都将在动画的结尾改变。

该插件扩展了 jQuery 内置的 .removeClass() 方法。如果 jQuery UI 未加载,调用 .removeClass() 方法不会直接失败,因为该方法在 jQuery 中存在。但是不会发生预期的行为。

实例

从匹配的元素中移除 class "big-blue" 。

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>.removeClass() 演示</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <style>
  div {
    width: 100px;
    height: 100px;
    background-color: #ccc;
  }
  .big-blue {
    width: 200px;
    height: 200px;
    background-color: #00f;
  }
  </style>
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
</head>
<body>
 
<div class="big-blue"></div>
 
<script>
$( "div" ).click(function() {
  $( this ).removeClass( "big-blue", 1000, "easeInBack" );
});
</script>
 
</body>
</html>


jQuery UI API 类别 – 特效核心jQuery UI API 类别 – 特效核心


分类导航

关注微信下载离线手册

bootwiki移动版 bootwiki
(群号:472910771)