1

我在 asp.net MVC4 项目中使用 JQuery 1.9.1 和 JQuery UI 1.10.2。我已经从 NuGet Tool 下载了所有这些 JS 和 Css。我在框中缺少 JQuery 对话框“X”图像。如何在对话框中获得它?

在此处输入图像描述

像这样的项目文件夹结构。

Project
|
|-Content
|    |
|    |-Themes
|       |
|        |- Base
|            |
|            |-Images
|            |
|            JQuery.UI.* Files
|            ---
|            ----
|
|
|-Scripts
    |
   JQuery-1.9.1.JS All Files
   JQuery-UI-1.10.2.JS All Files

当我搜索 JQuery-UI-1.10.2.js 时,我发现下面的代码插入图像。

this.uiDialogTitlebarClose = $("<button></button>")
            .button({
                label: this.options.closeText,
                icons: {
                    primary: "ui-icon-closethick" //This Image
                },
                text: false
            })
            .addClass("ui-dialog-titlebar-close")
            .appendTo( this.uiDialogTitlebar );
        this._on( this.uiDialogTitlebarClose, {
            click: function( event ) {
                event.preventDefault();
                this.close( event );
            }
        });

我不知道那个图像文件在哪里。我只有以下来自 JQuery UI 的图像文件。

在此处输入图像描述

4

4 回答 4

7

发生这种情况的原因是因为您在调用 jquery-ui 之后调用了 bootstrap。

从字面上看,交换两者,而不是:

<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>

来源:https ://stackoverflow.com/a/20457891/187025

于 2015-03-19T10:03:18.163 回答
5

我知道这是一篇旧帖子,但是我遇到了这个问题,没有任何建议对我有用,所以我想我会分享我的 2 美分。

在检查对话框关闭按钮的 DOM 时,我意识到虽然图像下载正确,但按钮本身看起来像这样:

<button class="ui-dialog-titlebar-close" type="button"></button>

因此,它在由 jquery 生成后缺少 ui-icon 和 ui-icon-closethick 类。这显然是一个错误。但是,我对此的简单解决方案只是在创建对话框后插入以下代码。

$('.ui-dialog-titlebar-close').addClass('ui-icon ui-icon-closethick');

这将导致按钮标签如下所示,并且图标正确显示。

<button class="ui-dialog-titlebar-close ui-icon ui-icon-closethick" type="button"></button>

我希望这对某人有所帮助。

于 2016-03-18T10:05:51.113 回答
0

每当我遇到一个看起来像您包含的对话框时,那是因为 jqueryUI css 文件没有正确加载。您的 html 中有一行包含它,例如

<link rel="stylesheet" href="themes/base/jquery-ui.css"></link>

正确的?

ui-icon-closethick只是告诉 jqueryUI 在哪里查看它的ui-icons图像,这是一个包含所有 173 个 jqueryUI 图标的单个图像。(您可以直接查看图像以获得想法,或者在 jqueryUI主题滚轮上查看它- 这实际上会向您显示对话框想要加载的图标集。)大多数图标通常来自内容颜色设置,尽管它们也有用于选定、活动等的图标集。您可以检查您的 css 文件的ui-icon定义以准确查看正在引用的图像集。

于 2013-07-17T13:50:06.250 回答
0

从此路径下载图像文件夹 https://github.com/jquery/jquery-ui/tree/master/themes/base/images 将该图像文件夹放在 css 文件夹中。确保名称正确。

于 2014-05-02T12:58:25.937 回答