要点：
当我使用基于AJAX的jQuery Mobile的页面导航模型加载它们时，资产有错误的URL。
情境：
2个网站：
实施
所有移动网页都有一个干净的网址，例如mydomain.com/mobile/page 即：mydomain.com/mobile/home，mydomain.com/mobile/aboutus，mydomain.com/mobile/contact，...
因此，所有移动页面都在其“head”区域内有一个像
这样的基本URL<base href="mydomain.com/mobile/" />
以便所有资产都能使用相对（和干净的）网址。
什么有效：
使用完整网址访问网页或禁用jQuery Mobile的页面导航模型（$.mobile.ajaxEnabled = false）时，所有内容（链接，资源）都像魅力一样。
问题：
当我不禁用jQuery Mobile的页面导航模型时，我打开的第一个移动页面工作正常，但在此之后，每当我按照页面中的链接，新页面都会通过Ajax加载并注入DOM，但所有的 具有相对（和干净）URL的资产/链接停止工作。他们的网址错误。
示例：
当我访问mydomain.com/mobile/aboutus时，“ aboutus ”会有一个带有相对网址 logo.png 的徽标图片（绝对值为mydomain.com/mobile/logo.png ）正确显示。但是，当我访问mydomain.com/mobile/home并点击指向mydomain.com/mobile/aboutus的链接时，会加载“ aboutus ”页面，但徽标图片网址已更改为 aboutlogo.png < / em>而不是正确的 logo.png
参考： http://jquerymobile.com/test/docs/pages/docs-navmodel.html
jQuery的另一个关键因素 移动的页面导航模型是 基本元素，注入 头部并在每页上修改 改变以确保任何资产 （css，images，js等）引用了它 页面将从适当的请求 路径。在不支持的浏览器中 对基本元素的动态更新 （比如Firefox 3.6），jQuery Mobile 循环遍历所有引用的 页面上的资产和前缀 href和src属性与基数 路径。
问题：
¿我做错了吗？¿是一个错误或者我误解了文档吗？我可以通过AJAX加载资产以获得正确的URL吗？
我想使用jQuery Mobile的页面导航模型，以便在移动浏览器中实现精彩的过渡。
告诉我代码！：
<!DOCTYPE html>
<head>
<base href="http://mydomain.com/mobile/" />
<link rel="stylesheet" href="jquery.mobile-1.0a3.min.css">
<script src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script src="jquery.mobile-1.0a3.min.js"></script>
...
</head>
<body>
<div id="home" data-role="page">
<div data-role="header">Foo</div><!--header -->
<div data-role="content">
<a href="about">About us</a>
</div><!--content -->
<div data-role="footer">Bar</div><!--footer -->
</div><!--page -->
</body>
</html>
<!DOCTYPE html>
<head>
<base href="http://mydomain.com/mobile/" />
<link rel="stylesheet" href="jquery.mobile-1.0a3.min.css">
<script src="http://code.jquery.com/jquery-1.5.min.js"></script>
<script src="jquery.mobile-1.0a3.min.js"></script>
...
</head>
<body>
<div id="about" data-role="page">
<div data-role="header">Foo</div><!--header -->
<div data-role="content">
<img src="logo.png" alt=""/><!--broken when loaded via AJAX-->
<a href="home" data-role="button" data-rel="back">Back</a><!--broken when loaded via AJAX-->
</div><!--content -->
<div data-role="footer">Bar</div><!--footer -->
</div><!--page -->
</body>
</html>
答案 0 :(得分：0)
我遇到了同样的问题，我想我找到了解决方案
我相信jQuery Mobile与基本网址混淆，我找到一些旧的文档，谈论其“基本网址管理系统”
http://jquerymobile.com/demos/1.0a1/#docs/pages/docs-navmodel.html
如果您使用相对于根目录的URL（开头是“/”），则所有图片都会正确加载..
在您的情况下使用以下代码应该工作：
<img src="/mobile/logo.png" alt=""/>
我知道拥有干净的相对URL会更好但我不认为jquery mobile现在支持它们
希望这有帮助
答案 1 :(得分：0)
在服务器端创建一个全局函数，它将相对资产作为参数，并输出文件的完整路径。在PHP中，类似于：
function abso($asset){
return "http://ydomain.com/mobile/" . $asset;
}
然后，在您的jQuery Mobile页面中，您可以写：
<img src="<?= abso('mobile/logo.png');?>" alt=""/>
如果您正在使用框架，可能已经有了一个功能。在CodeIgniter中，它是site_url()。