jquery.ui
jQuery UI 简介
jQuery UI 是基于 jQuery 的官方用户界面交互库，提供了一套完整的组件（如对话框、日期选择器、拖拽功能等）和交互效果（如动画、排序等）。它简化了前端开发中常见的 UI 功能实现，并与 jQuery 核心库无缝集成。
核心功能
- 交互组件：拖拽（Draggable）、放置（Droppable）、排序（Sortable）等。
- 小部件（Widgets）：日期选择器（Datepicker）、进度条（Progressbar）、选项卡（Tabs）等。
- 效果与动画：颜色动画、类过渡、显示/隐藏效果等。
安装与使用
-
通过 CDN 引入
在 HTML 中直接链接 jQuery 和 jQuery UI 的 CDN 文件：
<link rel="stylesheet" href="https://code.jquery.com/ui/1.13.2/themes/base/jquery-ui.css"> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="https://code.jquery.com/ui/1.13.2/jquery-ui.min.js"></script> -
本地安装
从 jQuery UI 官网 下载自定义包，解压后引入本地文件：<link rel="stylesheet" href="path/to/jquery-ui.min.css"> <script src="path/to/jquery-ui.min.js"></script>
示例代码
日期选择器（Datepicker）
<input type="text" id="datepicker">
<script>
$(function() {
$("#datepicker").datepicker();
});
</script>拖拽功能（Draggable）
<div id="draggable" style="width: 100px; height: 100px; background: #ccc;">拖拽我</div>
<script>
$(function() {
$("#draggable").draggable();
});
</script>主题定制
jQuery UI 支持通过 ThemeRoller 工具自定义主题，生成对应的 CSS 文件后替换默认样式即可。
注意事项
- 确保 jQuery 核心库先于 jQuery UI 加载。
- 部分组件依赖特定主题样式（如按钮、对话框），需引入完整的 CSS 文件。
- 官方文档提供了详细的 API 和示例，建议优先查阅。
如需进一步功能实现或问题排查，可参考 jQuery UI 官方文档。
