jQuery（七）UI库

8、The jQuery UI Library

jQuery自己仅仅提供核心的DOM，CSS，事件处理，Ajax功能。这些为构建高级别的抽象，好比UI部件，提供了完美的基础。jQuery UI库就是这样的抽象。这里咱们就简单的介绍下jQueryUI库，更详细的资料能够在http://jqueryui.com上查看文档说明。

jQueryUI库定义了不少的UI部件：有自动完成功能的输入框，日期选择器，组织信息用的折叠卡或者选项卡，滑动条和滚动条，模态对话框等。

除了这些部件之外，jQueryUI库实现了更通用的交互性，它能够很容易地使文档中的任意元素可以被拖放，改变大写，排序和选择。

最后jQueryUI在jQuery库的基础上增长了许多视觉效果方法（包括对颜色进行动画的效果），而且定义了不少的缓动函数。

 

能够认为jQueryUI库是许多的jQuery插件打包在一个单独的javascript文件中，要使用jQueryUI库，只须要在引入jQuery代码后，再引入jQueryUI的代码便可。不过在jQueryUI的下载页面上，你能够只下载你想要使用的组件，与加载整个jQueryUI库相比，这样能够减小javascript代码的加载时间。

 

jQuery是彻底主题化的，它的主题采用CSS文件的形式提供，全部除了加载UI库的代码，还须要加载你想要的主题CSS文件。jQueryUI网站提供了预约义的主题，也能够在网站上定义你本身的主题而后下载。

 

jQueryUI部件是插件形式组织的，每一个插件定义了一个jQuery的方法。当在已经存在的文档元素上调用这个方法，它把这个元素转成对应的UI部件。好比，把文本输入框转成日期选择器：

$("input.date").datepicker();//把全部带有属性class="date"的<input>元素转成date picker部件

 

为了充分使用jQueryUI的部件，你应该熟悉它的三件事：部件的配置选项，部件的方法，部件的事件。全部部件都是可配置的，有些还有许多的配置项，你能够自定义部件的外观和行为，经过传递一个选项对象。

 

每一个部件经过定义了不少的方法来与部件交互，可是这些部件方法都不是真正的jQuery方法，每一个部件只提供了一个jQuery方法。经过传递一个部件方法名到这个jQuery方法中，实现对部件方法的调用。好比要是一个日期选择部件不可用，咱们调用datepicker("disable");

 

jQueryUI的部件一般定义了一些自定义的事件，你能够经过正常的bind方法来绑定事件处理器，处理器的第一个参数为Event对象，有的部件会有第二个参数，是一个UI的对象，提供有关部件的状态信息。

jQueryUI文档中描述的事件有时不是真正的自定义事件，而只是回调函数，能够经过配置选项对象进行设置。