Jquery Mobile 图片未显示在 Phonegap 中

Question

我有一个在 Phonegap 构建中构建的应用程序，但是该应用程序不再在图标等中显示图像。例如，后退按钮显示但不显示后退按钮内的小箭头。我对我的应用程序所做的唯一更改是我将应用程序所需的所有 JS 文件都存储在本地并在本地引用。

我能解决这个问题吗？

Answer 1

本地文件

您缺少对图像文件的引用。

它们可以在 css/images 目录中找到。或者，当您将库下载为 ZIP 文件时，您可以找到名为 images 的文件夹。

更具体一点：

HTML 文件，直接在根文件夹中

webapp/Index.html

根/JS文件夹下的脚本

webapp/js/jquery.mobile-1.3.0.min.css

webapp/js/jquery-1.8.2.min.js

webapp/js/jquery.mobile-1.3.0.min.js

根/JS/images/文件夹下的图片

webapp/js/images/ajax-loader.gif

webapp/js/images/icons-18-black.png

webapp/js/images/icons-36-black.png

webapp/js/images/icons-18-white.png

webapp/js/images/icons-36-white.png

这些位置取自 Omar's 答案：https://stackoverflow.com/a/15762397/1848600

远程文件

更简单的解决方案是将所有内容链接到在线资源：

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.css" />
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.0/jquery.mobile-1.3.0.min.js"></script>

如果它适用于他们，那么你的问题就在这个目录中。

Answer 2

我自己刚刚解决了本机设备上缺少图标的问题。当我使用上面发布的外部链接时，图标看起来很好。我担心 Apple 不批准我的应用程序中的外部下载代码，因此我继续尝试使用本地项目文件的选项。

我偶然发现了一个可行的本地设置，但可能不推荐使用。我尝试切换到 jquery.mobile-1.2.1.min.css，而不是 1.3.0，图标突然出现了！所以我的配置是：

<link href="jquery-mobile/jquery.mobile-1.2.1.min.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="jquery-mobile/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="jquery-mobile/jquery.mobile-1.3.0.min.js"></script>