jQuery ui 关闭按钮未显示,但可以正常工作
Posted
技术标签:
【中文标题】jQuery ui 关闭按钮未显示,但可以正常工作【英文标题】:jQuery ui close button is not shown but it works properly 【发布时间】:2017-12-08 22:02:51 【问题描述】:我正在使用 jQuery-ui 对话框并添加了库:
<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/jquery-ui.css">
<script src="../js/jquery-3.2.1.min.js"></script>
<script src="../js/tether.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<script src="../js/jquery-ui.js"></script>
但是当对话框出现时,你看不到关闭按钮X。
我可以这样看:
我在控制台出现这些错误:
加载资源失败:服务器响应状态为 404 (未找到)
【问题讨论】:
您需要下载错误中指定的图片。这意味着图像不存在于您的项目中 如果您使用 jquery ui,请下载完整包.. 我应该下载哪个主题才能有常规的蓝色关闭按钮? 试试这个,ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/themes/ui-darkness/… 请将解决方案发布为答案,而不是更新您的问题。这是为了避免混淆。谢谢。 【参考方案1】:当您下载 Jquery UI zip 文件并解压缩时,会出现一个 images 文件夹。复制并粘贴到您的项目文件夹中。然后,它将完美地工作。
【讨论】:
【参考方案2】:错误:
您的服务器上没有 3 个 png。
您可以在以下位置指向 pngs:
CDN
https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/base/images/ui-icons_444444_256x240.png
https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/base/images/ui-icons_555555_256x240.png
https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/themes/base/images/ui-icons_777777_256x240.png
或
下载它们并将它们放在您自己的服务器上。
在这两种情况下,您都可能需要更改 html 文件中 1. 样式表或 2. 内联 <style>
标记中的规则集:
-
样式表:
jquery-ui.css
行。要查找要编辑的特定行,请转到该错误日志并单击每个错误。您应该被重定向到 CSS 文件的浏览器视图,并找到您需要编辑的确切行。
或
<style>...</style>
在<head>
标记内。
【讨论】:
【参考方案3】:图像文件不是原来的地方请下载插件所需的图像并重试下面的代码
<link rel="stylesheet" href="../css/bootstrap.min.css">
<link rel="stylesheet" href="../css/jquery-ui.css">
<script src="../js/jquery-3.2.1.min.js"></script>
<script src="../js/tether.min.js"></script>
<script src="../js/bootstrap.min.js"></script>
<script src="../js/jquery-ui.js"></script>
【讨论】:
以上是关于jQuery ui 关闭按钮未显示,但可以正常工作的主要内容,如果未能解决你的问题,请参考以下文章