0

我有一个我想提出的动态对话......例如

var newDiv = $(document.createElement('div'));

$(newDiv).html('Hello World');
$(newDiv).dialog({
    closeOnEscape: false,
    draggable: false,
    modal: true,
    resizable: false,
    width: 725

});

一切都很好,但是我的动态对话框有一个我不想要的标题。当然,我可以通过修改以下 CSS 类来删除它... .ui-dialog-titlebar {display:none}

但是,我只希望对话框的这个实例没有标题,并且我不希望将其应用于我系统中的所有其他对话框。删除动态对话框上的标题的最佳方法是什么?我正在考虑将 CSS 方法更改为对话框,就像这样... $(newDiv).dialog({... stuff}).css() 但到目前为止没有任何效果。

我认为问题是由于我的动态 div 没有一个很难引用的 ID ...任何想法吗?

请注意,如果我没有很好地描述我的问题,请这样说,我会改写/扩展......我已经工作了几个小时,我开始发疯了......

请注意澄清:我想删除整个标题栏和样式......不仅仅是标题通常是空字符串。

4

2 回答 2

3

您可以在动态对话框中添加一个名为“dialog-no-title”之类的 CSS 类,然后在该类下添加相关的 CSS dialog-no-title {display:none}

要将类添加到 DOM 元素,请参阅 jQuery 文档。它看起来像这样:.addClass("dialog-no-title")。我猜你可以这样做:

var newDiv = $(document.createElement('div'));  

$(newDiv).html('Hello World');

$(newDiv).dialog({
    closeOnEscape: false,
    draggable: false,
    modal: true,
    resizable: false,
    width: 200,
    dialogClass: 'dialog-no-title'
});

编辑:更新了代码示例以反映评论。这是一个适合您的 jsFiddle:http: //jsfiddle.net/nj2Q9/21/

干杯,

詹姆士

于 2012-04-11T10:55:52.080 回答
0

正如 Alex K. 建议的那样:

$(newDiv).dialog({
    closeOnEscape: false,
    draggable: false,
    modal: true,
    resizable: false,
    width: 725,
    dialogClass: 'ui-dialog-noheader' 
});

然后在你的 CSS

.ui-dialog-noheader .ui-dialog-titlebar {display:none}

它以 noheader 类中的对话框标题栏为目标。

于 2012-04-11T11:06:19.227 回答