我使用一个自定义的jQuery 1.10.3主题。我下载了每一个直接从主题辊，我故意没有改变任何东西。
我创建了一个对话框，我得到了一个空白的灰色正方形，关闭图标应该是:
我比较了在我的页面上生成的代码:
<div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
<spanid="ui-id-2" class="ui-dialog-title">Title</span>
<button class="ui-dialog-titlebar-close"></button>
</div>
到Dialog Demo页面生成的代码:
<div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix">
<span id="ui-id-1" class="ui-dialog-title">Basic dialog</span>
<button class="ui-button ui-widget ui-state-default ui-corner-all ui-button-icon-only ui-dialog-titlebar-close" role="button" aria-disabled="false" title="close">
<span class="ui-button-icon-primary ui-icon ui-icon-closethick"></span>
<span class="ui-button-text">close</span>
</button>
</div>
EDIT
代码的不同部分是由jQueryUI生成的，而不是我，所以我不能只添加span标签而不编辑jQueryUI js文件，这似乎是一个糟糕/不必要的选择，以实现正常的功能。
下面是用来生成这部分代码的JavaScript代码:
this.element.dialog({
appendTo: "#summary_container",
title: this.title(),
closeText: "Close",
width: this.width,
position: {
my: "center top",
at: ("center top+"+(window.innerHeight*.1)),
collision: "none"
},
modal: false,
resizable: false,
draggable: false,
show: "fold",
hide: "fold",
close: function(){
if(KOVM.areaSummary.isVisible()){
KOVM.areaSummary.isVisible(false);
}
}
});
我不知所措，需要帮助。
我使用jQuery UI 1.8.17和我有同样的问题，加上我有额外的css样式表应用到页面上的东西，包括
titlebar颜色。因此，为了避免任何其他问题，我使用下面的代码针对确切的ui元素:
$("#mydialog").dialog('widget').find(".ui-dialog-titlebar-close").hide();
$("#mydialog").dialog('widget').find('.ui-icon ui-icon-closethick').hide();
然后我在对话框本身的属性中添加了一个关闭按钮:
.．.
modal : true,
title: "My Dialog",
buttons: [{text: "Close", click: function() {$(this).dialog("close")}}],
...
出于某种原因，我必须同时瞄准这两种道具，但它确实有效!
我迟到了一段时间，但我要让你大吃一惊，准备好了吗?
发生这种情况的原因是，在调用jquery-ui in之后，你调用了bootstrap in。
从字面上看，交换这两个，这样就不是:
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="js/bootstrap.min.js"></script>
它变成了
<script src="js/bootstrap.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
:)
Edit - 26/06/2015 - this keeps attracting interest months later so I
thought it was worth an edit. I actually really like the noConflict
solution offered in the comment underneath this answer and clarified
by user Pretty Cool as a separate answer. As some have reported issues
with the bootstrap tooltip when the scripts are swapped. I didn't
experience that issue however because I downloaded jquery UI without
the tooltip as I didn't need it because bootstrap. So this issue never
came up for me.
Edit - 22/07/2015 - Don't confuse jquery-ui with jquery! While
Bootstrap's JavaScript requires jQuery to be loaded before, it doesn't rely on jQuery-UI. So jquery-ui.js can be loaded after bootstrap.min.js, while jquery.js always needs to be loaded before Bootstrap.
我也有这个问题。下面是为关闭按钮插入的代码:
当我关闭按钮上的style="display:none:"时，就会出现关闭按钮。所以出于某种原因，显示:没有;已经准备好了，我不知道怎么控制它。因此，解决这个问题的另一种方法可能是简单地重写显示:none。但我不知道该怎么做。
我注意到KyleMit发布的答案确实有效，但使X按钮看起来不同。
我还注意到，这个问题并不会影响我页面上的所有对话框，只会影响一部分对话框。一些对话框按预期工作;其他的没有标题(即，包含标题的span是空的)，而关闭按钮是存在的。
我在想有些事情是严重错误的，现在可能不是1.10.x的时候。
但经过进一步的工作，我发现在某些情况下，标题设置不正确，在修复这个问题后，X关闭按钮重新出现。
我曾经这样设置标题:
('#ui-dialog-title-ac-popup').text('Add Admin Comments for #' + $ac_userid);
id不存在于我的代码，但显然是由jquery从ac-popup和ui-dialog-title创建的。有点拼凑。但正如我所说的那样，这已经行不通了，我不得不使用以下方法:
$('.ui-dialog-title').text('Add Admin Comments for #' + $ac_userid);
这样做之后，丢失按钮的问题似乎有所好转，尽管我不确定它们是否一定相关。
