admin 管理员组

文章数量: 1086019


2024年3月12日发(作者：continue语句只有保留字 没有语句体)

杨教授工作室 精心创作的优秀程序员 职业提升必读系列资料

前 言

jQuery UI是基于jQuery基础类库API开发的开源的JavaScript 网页UI（用户界面）代

码组件库，使用jQuery UI可以实现Web UI界面交互、动画、特效和可更换主题的可视控

件，并且还可以定制Web UI的主题风格。从而可以应用它轻松地构建出高度可交互的Web

应用程序的UI界面。

随着Web应用的普及及AJAX相关应用的深入，客户端和Web服务器端需要频繁地交

互数据，对Web交互的界面也提出了新的要求——简洁、方便、人性化等用户体验度高；

同时随着移动设备的普及，客户端的访问设备也逐渐多样化。如何为不同的客户端设备提

供统一的Web应用界面，从而提高开发效率和降低开发成本。目前比较好的技术实现手段

是应用JQuery及JQuery UI系统库相关的技术。

作者根据自身多年的软件开发实践和经验总结，结合多年的IT职业培训的教学和高校

软件学院一线的教学工作体验，在本系列文档中通过具体的程序代码示例为读者介绍

jQuery UI中典型的应用组件技术。本文档主要涉及jQuery UI Tabs组件主要的技术特性、

Tabs组件主要的成员属性及应用示例、Tabs组件主要的事件及应用示例、如何创建普通的

Tabs组件实现示例以及如何创建特殊的Tabs组件实现示例等方面的内容。

1

杨教授工作室，版权所有，盗版必究， 1/32页

杨教授工作室 精心创作的优秀程序员 职业提升必读系列资料

本 文 目 录

1.1 jQuery UI选项卡Tabs ................................................................................................................. 3

1.1.1

1.1.2

1.1.3

1.2

jQuery UI Tabs组件主要的技术特性 .................................................................................. 3

Tabs组件主要的成员属性及应用示例 ............................................................................... 4

Tabs组件主要的事件及应用示例 ..................................................................................... 11

普通的Tabs组件实现示例 ........................................................................................................ 15

1.2.1

1.2.2

1.2.3

页头Tab和页面内容构成要素 ......................................................................................... 15

普通的Tabs组件的应用示例 ............................................................................................ 15

使用cookie缓存最后选中Tab页签的应用示例 ............................................................. 18

1.3 特殊的Tabs组件实现示例 ........................................................................................................ 20

1.3.1

1.3.2

1.3.3

1.3.4

1.3.5

面板的内容通过AJAX技术异步更新的应用示例 ......................................................... 20

可以重新排序卡片头的应用示例 ..................................................................................... 20

动态添加和删除Tabs组件内的页头和内容区域的示例 ................................................ 22

卡片标题朝下的Tabs组件实现示例 ................................................................................ 26

实现纵向Tabs组件应用示例 ............................................................................................ 29

2

杨教授工作室，版权所有，盗版必究， 2/32页


本文标签： 组件 应用 示例 实现 界面

版权声明：本文标题：通过代码示例学习jQueryUI库Tabs(选项卡)应用技术 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.roclinux.cn/b/1710239843a563861.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。