jQuery UI API 类别 – 小部件（Widgets）

jQuery UI API 类别 – 小部件（Widgets）

Widgets 是 jQuery UI 最核心、最常用的类别，它包含了一系列现成的高度交互 UI 组件（小部件）。所有这些小部件都基于 Widget Factory 构建，因此拥有统一的 API（初始化、option、destroy 等通用方法）、事件系统和主题支持。

官方文档地址：https://api.jqueryui.com/category/widgets/（适用于最新版本 1.14.1）

Widgets 包含的小部件列表（共 12 个）

小部件名称	描述	主要用途与示例
Accordion	可折叠/展开的手风琴式面板。	垂直内容分组、FAQ 页面。
Autocomplete	输入框自动完成建议列表，支持本地或远程数据源。	搜索框、标签输入。
Button	美化按钮，支持单选/复选按钮、按钮组、图标按钮。	统一按钮样式。
Checkboxradio	美化复选框（checkbox）和单选按钮（radio），统一主题样式。	表单美化。
Controlgroup	将多个按钮、复选框等组合成一组（横向或纵向）。	工具栏、按钮组。
Datepicker	弹出式日期选择器，支持本地化、日期范围、自定义格式。	表单日期输入。
Dialog	模态/非模态对话框，支持拖拽、调整大小、按钮。	弹出提示、确认框、表单。
Menu	下拉或上下文菜单，支持键盘导航、子菜单。	导航菜单、下拉选项。
Progressbar	进度条，支持确定/不确定模式、数值设置。	文件上传、任务进度。
Selectmenu	美化原生 <select> 下拉菜单，支持搜索、分组、自定义渲染。	表单下拉增强。
Slider	滑块控件，支持单值、范围、步长、垂直方向。	价格范围、音量调节。
Spinner	数值微调器（上下箭头输入框），支持步长、最小/最大值。	数量选择、年龄输入。
Tabs	标签页切换，支持 AJAX 加载、排序、可关闭标签等。	内容分块显示、向导步骤。
Tooltip	工具提示，支持自定义内容、位置、触发方式。	鼠标悬停提示、表单验证提示。

基本使用模式（所有小部件统一）

$(function() {
    // 初始化（可带选项）
    $("#elem").widgetName({ /* 选项 */ });

    // 调用方法
    $("#elem").widgetName("methodName", args);

    // 设置/获取选项
    $("#elem").widgetName("option", "key", value);

    // 销毁
    $("#elem").widgetName("destroy");
});

示例：Tabs 小部件

<div id="tabs">
    <ul>
        <li><a href="#tab1">标签1</a></li>
        <li><a href="#tab2">标签2</a></li>
    </ul>
    <div id="tab1">内容1</div>
    <div id="tab2">内容2</div>
</div>

<script>
$("#tabs").tabs({
    active: 0,           // 默认激活第一个标签
    collapsible: false   // 是否允许全部折叠
});
</script>

注意：

• 所有小部件自动应用 CSS Framework 类（如 .ui-widget、.ui-state-active），完美支持 ThemeRoller 主题。
• 项目已进入维护模式（最新 1.14.1），这些小部件稳定可靠，但新项目推荐使用现代框架（如 Bootstrap、Material UI、Element Plus）。

如果您想深入某个具体小部件（如 Datepicker、Dialog 或 Tabs）的所有选项、方法、事件或完整代码示例，请告诉我！