jQuery UI 小部件方法调用
jQuery UI 是一个建立在 jQuery JavaScript 库之上的用户界面交互、特效、小部件及主题的库。它为开发者提供了易于使用的界面元素，如拖动、排序、选择等，以及一些复杂的小部件，如日期选择器、对话框和进度条等。在小部件的使用过程中，方法调用是必不可少的，它允许开发者控制小部件的行为和状态。
基本概念
在 jQuery UI 中，小部件是通过 $.widget() 函数创建的。每个小部件都有一个基础构造函数和一个基础原型，用于定义小部件的属性、方法和事件。当小部件被初始化时，它会创建一个实例，并允许开发者通过该实例调用小部件的方法。
方法调用语法
小部件的方法调用通常遵循以下语法：
$(selector).widgetName('methodName', parameter1, parameter2, ...);
selector：选择器字符串，用于选择页面上的元素。widgetName：小部件的名称，例如datepicker、dialog等。methodName：要调用的小部件方法名称。parameter1, parameter2, ...：传递给方法的参数。
常用方法
不同的 jQuery UI 小部件具有不同的方法。以下是一些常用小部件及其方法的示例：
日期选择器（Datepicker）
日期选择器小部件提供了多种方法，如设置和获取日期、关闭日期选择器等。
// 初始化日期选择器
$('#datepicker').datepicker();// 设置日期
$('#datepicker').datepicker('setDate', new Date());// 获取日期
var date = $('#datepicker').datepicker('getDate');// 关闭日期选择器
$('#datepicker').datepicker('hide');
对话框（Dialog）
对话框小部件允许开发者打开、关闭和操作对话框。
// 初始化对话框
$('#dialog').dialog();// 打开对话框
$('#dialog').dialog('open');// 关闭对话框
$('#dialog').dialog('close');// 修改对话框标题
$('#dialog').dialog('option', 'title', '新标题');
进度条（Progressbar）
进度条小部件用于显示任务的进度。
// 初始化进度条
$('#progressbar').progressbar();// 设置进度
$('#progressbar').progressbar('value', 50);// 获取进度
var value = $('#progressbar').progressbar('value');
高级用法
除了基本的方法调用外，jQuery UI 还提供了一些高级功能，如方法链、事件绑定和解绑等。
方法链
方法链允许开发者连续调用多个方法，以提高代码的可读性和效率。
$('#datepicker').datepicker('setDate', new Date()).datepicker('option', 'dateFormat', 'yy-mm-dd');
事件绑定和解绑
小部件事件可以通过 .on() 和 .off() 方法绑定和解绑。
// 绑定事件
$('#dialog').on('dialogopen', function() {console.log('对话框已打开');
});// 解绑事件
$('#dialog').off('dialogopen');
结论
jQuery UI 小部件的方法调用是控制和定制小部件行为的关键。通过了解和掌握这些方法，开发者可以更高效地使用 jQuery UI 库，创建出功能丰富且用户体验优秀的网页应用。
