12-隐藏关闭按钮
4.5.4 隐藏关闭按钮
可以移除(隐藏)关闭按钮来阻止关闭对话框。
关闭按钮是一个和 ui-dialog-titlebar-close
CSS类关联的 <a>
链接。在由调用 dialog
(options)
方法产生的HTML中很容易找到这个链接(比如,用Firebug)。它位于对话框内容元素前面的兄弟元素中(如粗体部分所示):
<!DOCTYPE html>
<script src = jquery.js></script>
<script src = jqueryui/js/jquery-ui-1.8.16.custom.min.js></script>
<link rel=stylesheet type=text/css
href=jqueryui/css/smoothness/jquery-ui-1.8.16.custom.css />
<div id="dialog" title="Window title">
<p> Content of the dialog box</p>
</div>
<script>
$("div#dialog").dialog ().prev ().find (".ui-dialog-titlebar-close").hide ();
</script>
这条语句包括以下步骤:
1.调用 dialog ()
方法转成HTML对话框;
2.用 prev ()
方法得到对话框内容元素之前的兄弟元素;
3.在通过如上关系,查找有 ui-dialog-titlebar-close
CSS类的元素;
4.用 hide ()
方法隐藏这个元素。
这必须按列出的顺序执行完成。比如,如果我们不先调用 dialog ()
方法,则在用 prev ()
方法得到的前面元素中会找不到关闭按钮链接,因为HTML还没转变成对话框呢!
如图4-8所示,关闭按钮是不可见的。