这是对上面答案的评论，但我觉得它值得有一个单独的答案，因为它帮助我回答了这个问题。

如果你想在JQuery UI之后声明Bootstrap(我这样做是因为我想使用Bootstrap工具提示)，声明以下内容(我在$(document).ready之后声明)将允许按钮再次出现(答案来自https://stackoverflow.com/a/23428433/4660870)

var bootstrapButton = $.fn.button.noConflict() // return $.fn.button to previously assigned value
$.fn.bootstrapBtn = bootstrapButton            // give $().bootstrapBtn the Bootstrap functionality

  just add in css
 .ui-icon-closethick{
 margin-top: -8px!important;
margin-left: -8px!important;

}

这似乎是jQuery发布方式中的一个bug。你可以在Dialog Open事件上手动修改一些dom操作:

$("#selector").dialog({
    open: function() {
        $(this).closest(".ui-dialog")
        .find(".ui-dialog-titlebar-close")
        .removeClass("ui-dialog-titlebar-close")
        .html("<span class='ui-button-icon-primary ui-icon ui-icon-closethick'></span>");
    }
});

我迟到了一段时间，但我要让你大吃一惊，准备好了吗?

发生这种情况的原因是，在调用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.

我找到了三个方法:

You can just load bootsrap first. And them load jquery-ui. But it is not good idea. Because you will see errors in console. This: var bootstrapButton = $.fn.button.noConflict(); $.fn.bootstrapBtn = bootstrapButton; helps. But other buttons look terrible. And now we don't have bootstrap buttons. I just want to use bootsrap styles and also I want to have close button with an icon. I've done following: How close button looks after fix .ui-dialog-titlebar-close { padding:0 !important; } .ui-dialog-titlebar-close:after { content: ''; width: 20px; height: 20px; display: inline-block; /* Change path to image*/ background-image: url(themes/base/images/ui-icons_777777_256x240.png); background-position: -96px -128px; background-repeat: no-repeat; }

甚至在jquery-ui后加载引导，我能够使用这个修复:

.ui-dialog-titlebar-close:after {
   content: 'X' !important;
   position: absolute;
   top: -2px;
   right: 3px;
}