📌  相关文章
📜  JqueryUI-开关类

📅  最后修改于: 2020-10-23 07:28:30             🧑  作者: Mango

本章将讨论switchClass（）方法，这是一个有用的新类。 switchClass（）方法将一个CSS类从一个CSS类移到另一个CSS类，从而使从一种状态过渡到另一种状态成为可能。

句法

在jQueryUI的1.0版中添加

switchClass（）方法的基本语法如下：

.switchClass( removeClassName, addClassName [, duration ] [, easing ] [, complete ] )
Sr.No. Parameter & Description
1

removeClassName

This is a String and represents the CSS class name, or space-delimited list of class names, to be removed.
2

addClassName

This is of type String and represents one or more class names (space separated) to be added to the class attribute of each matched element.
3

duration

This is of type Number or String and optionally provides one of slow, normal, fast, or the duration of the effect in milliseconds. If omitted, the animate() method determines the default. Its default value is 400.
4

easing

The name of the easing function to be passed to the animate() method.
5

complete

This is a callback method called for each element when the effect is complete for this element.

在jQueryUI 1.9版本中添加

在1.9版中，此方法现在支持子选项，该选项还将为后代元素设置动画。

.switchClass( removeClassName, addClassName [, options ] )
Sr.No. Parameter & Description
1

removeClassName

This is a String and represents the CSS class name, or space-delimited list of class names, to be removed.
2

addClassName

This is of type String and represents one or more class names (space separated) to be added to the class attribute of each matched element.
3

options

This represents all animation settings. All properties are optional. Possible values are −

  • duration − A string or number determining how long the animation will run.. Its default value is 400.

  • easing − A string indicating which easing function to use for the transition. Its default value is swing. Possible values are here.

  • complete − This is a callback method called for each element when the effect is complete for this element.

  • children − This is a Boolean and represents whether the animation should additionally be applied to all descendants of the matched elements.

  • queue − This is of type String/Boolean indicating whether to place the animation in the effects queue..

例子

下面的示例演示了switchClass（）方法的用法。


      jQuery UI Switch Class Example
      
      
      
      
      
      
      
      
   
   
   
      

         Tutorials Point Rocks!!!
      

      

         Welcome to Tutorials Point!!!

让我们将上面的代码保存在HTML文件switchclassexample.htm中，并在支持javascript的标准浏览器中将其打开，您还必须看到以下输出。现在，您可以处理结果了-

单击“切换类”按钮以查看框中的类效果。