在jQuery对话框中隐藏标题栏和显示关闭按钮

Question

我在jQuery Dialog隐藏了标题栏，如下所示

$(".ui-dialog-titlebar").hide();

这也隐藏了Dialog中的关闭按钮。但我需要在Dialog上显示关闭按钮。

我该怎么做？

Answer 1

添加以下CSS将隐藏标题文字和样式，保留关闭按钮 - see demo。

.ui-dialog-title {
    display:none;
}

.ui-dialog-titlebar {
    background:transparent;
    border:none;
}

.ui-dialog .ui-dialog-titlebar-close {
    right:0;
}

但是，如果您想要更改关闭按钮本身的样式（如您在其他问题中提到的那样 - Arrow in Bottom of jQuery Dialog），那么我建议您再问另一个问题，因为显示closeText仍然是 使用jQuery主题时出现问题 - 请参阅jQuery UI Dialog - Cannot see the closeText

Answer 2

尝试展示ui-dialog-titlebar-close

的dialog类

$(".ui-dialog-titlebar-close").show();

用css（我在做什么）

body .ui-dialog-titlebar-close{
   visibility=visible;
}

Answer 3

这对我有用：

（假设你的关闭按钮有id #close）

$(".ui-dialog-titlebar : not(#close)").hide();

Answer 4

试试这个：

    $(".ui-dialog-titlebar").css('visibility','hidden');
    $(".ui-dialog-titlebar-close").css('visibility','visible');

See Demo

Answer 5

将高度设置为0怎么样？看似工作满足我的需求。

.ui-dialog-titlebar {
  height: 0;
}