jQuery UI库中dialog对话框功能使用全解析

对话框（dialog），是jQuery UI 非常重要的一个功能。它彻底的代替了JavaScript
的alert()、prompt()等方法，也避免了新窗口或页面的繁杂冗余。

一．开启多个dialog
只要设置不同的id 即可实现。

$('#x').dialog(); $('#y').dialog();

二．修改dialog 样式
在弹出的dialog 对话框中，在火狐浏览器中打开Firebug 或者右击->查看
元素。可以看看dialog 的样式，对dialog 的标题背景进行修改。

//无须修改ui 里的CSS，直接用style.css 替代掉 .ui-widget-header {    background:url(../img/xxx.png);  }

三．dialog()方法的属性
对话框方法有两种形式：1.dialog(options)，options 是以对象键值对的形式
传参，每个键值对表示一个选项；2.dialog('action', param)，action 是操作对
话框方法的字符串，param则是options 的某个选项。

dialog 外观选项

属性

默认值/类型

说明

title

无/字符串

对话框的标题，可以直接设置在DOM 元素上

buttons

无/对象

以对象键值对方式，给dialog 添加按钮。键是按钮

上一篇：详解jQuery UI库中文本输入自动补全功能的用法

下一篇：使用jQuery UI库开发Web界面的简单入门指引