Manual Rujukan Cina UI jQuery

---

Menurut "Manual Rujukan Cina UI jQuery", UI jQuery ialah satu set interaksi antara muka pengguna, kesan khas, widget dan tema yang dibina pada perpustakaan JavaScript jQuery. Sama ada anda mencipta aplikasi web yang sangat interaktif atau hanya menambah pemilih tarikh pada kawalan borang, UI jQuery ialah pilihan yang tepat. UI jQuery mengandungi banyak widget yang mengekalkan keadaan, jadi ia berbeza sedikit daripada corak penggunaan pemalam jQuery biasa.

---

jQuery UI是一套JavaScript 库，提供抽象化、可自定义主题的GUI控件与动画效果。基于jQuery JavaScript库，可用来建构交互式的互联网应用程序。在2007年9月约翰·雷西格于jquery.com博客里的一篇文章里正式公诸于世。最新的版本需要jQuery 2.1.1或更新的版本。

提示：在开始学习 jQuery UI之前，您需要具备HTML、CSS、JavaScript基础知识。

jQuery UI的优缺点：

优点：

1、简单易用，继承 jQuery 简易使用特性，提供高度抽象接口，短期改善网站易用性。

2、轻便快捷，组件间相对独立，可按需加载，避免浪费带宽拖慢网页打开速度。

3、标准先进，支持 WAI-ARIA，通过标准 XHTML 代码提供渐进增强，保证低端环境可访问性。

4、强力支持，Google 为发布代码提供 CDN 内容分发网络支持。

缺点：

1、代码不够健壮：缺乏全面的测试用例，部分组件 Bugs 较多，不能达到企业级产品开发要求。

2、构架规划不足：组件间 API 缺乏协调，缺乏配合使用帮助。

3、控件较少：相对于 Dojo、YUI、Ext JS 等成熟产品，可用控件较少，无法满足复杂界面功能要求。

提示：我们的jQuery UI教程将帮助您逐步学习如何掌握并使用jQuery UI，如果你有任何疑问，请前往PHP中文网jQuery UI社区提出你的问题，会有热心网友为你解答。

jQuery UI功能

以1.9.0版本为例。

交互

• 拖曳（Draggable）–让元素可以用鼠标拖曳。

• 拖放（Droppable）–让控件可以接受其他拖曳进来的元素。

• 调整大小（Resizable）–让元素可以调整大小。

• 选取（Selectable）–提供高级的大量元素选择功能。

• 排序（Sortable）–让列表可以更容易排序。

控件

• jQuery UI的所有控件都能自定义主题样式。

• 手风琴式菜单（Accordion）–如手风琴般可伸缩的控件。

• 自动完成（Autocomplete）–根据用户的输入来自动完成文字栏。

• 按钮（Button）–增强按钮外观，将单选与复选控件转变成按钮型式。

• 日期选择器（Datepicker）–高级的日期选择工具。

• 对话框（Dialog） –在页面最上层显示对话框。

• 菜单（Menu） - 显示多层次结构式的菜单。

• 进度条（Progressbar） –动态与静态的进度指示条。

• 滑动条（Slider）–完全可以自定义的滑动条与各种功能。

• 微调选择器（Spinner） - 上下控制的数字微调输入栏。

• 页签（Tabs）–页签切换控件，可以内嵌或动态加载内容。

• 工具提示（Tooltip） - 弹出式提示框。

效果

• 颜色动画（Color Animation）–产生颜色转变的动画效果。

• 切换Class、新增Class、移除Class、开关Class –让页面上元素样式转变时有动画效果。

• 效果（Effects）–各种效果（显示、下拉、爆炸、淡入等等）。

• 切换（Toggle）–切换效果开关。

• 隐藏、显示 - 使用上述的效果。

工具

位置（Position） –根据另一个元素来设置目标元素的位置（对齐）。

本jQuery UI教程手册涵盖的内容

本jQuery UI教程手册涵盖所有jQuery UI初级到高级知识，包含了jQuery UI入门、jQuery UI主、jQuery UI部件库等知识。

提示：本教程的每一章都包含了很多jQuery UI实例，您可以直接点击 "运行实例" 按钮在线查看结果或者直接使用在线编辑器进行测试。这些例子将帮助您更好地理解和使用jQuery UI。

其它jQuery UI相关学习参考资源

除了本页面右侧的知识拓展，还为大家精选了以下资源

• 独孤九贱(6)_jQuery视频教程