资产有错误的URL

资产，当我使用基于AJAX的jQuery Mobile的页面导航模型加载它们错误的URL。

场景：

2网站：

mydomain.com - >正常的网站（这里没有问题，忘了）
mydomain.com/mobile - >移动网站

执行：

个

所有移动网页有一个干净的URL像mydomain.com/mobile/page 即：mydomain.com/mobile/home，mydomain.com/mobile/aboutus，mydomain.com/mobile/contact，...

因此，所有的移动页面都有他们的“头” seccion基本URL里面像

<base href="mydomain.com/mobile/" />

为了使所有的资产与相对（和干净的）URL一起工作。

什么工作：

当访问网页使用完整的URL，或禁用jQuery Mobile的的页面导航模型（$.mobile.ajaxEnabled = false）一切（链接，资产）的作品就像一个魅力。

问题：

当我不关闭的jQuery Mobile的页面导航模型，第一个移动网页我打开工作正常，但在那之后，每当我按照页面中的链接时，新页面通过Ajax加载并注入到DOM中，但所有带有相对（和干净）URL的资产/链接停止工作。他们有一个错误的网址。

例子：

当我访问mydomain.com/mobile/aboutus的 “关于我们” 与相对URL logo.png（绝对是mydomain.com/mobile/logo.png）是正常显示的标志形象。但是，当我访问mydomain.com/mobile/home，我点击一个链接到mydomain.com/mobile/aboutus，在“关于我们”页面加载，但标志图像URL被改变aboutlogo.png而不是正确的一个标志。PNG

参考： http://jquerymobile.com/test/docs/pages/docs-navmodel.html

jQuery的移动的页面导航模型的另一个关键因素是基本元素，将其注入到头部和修改每个页面更改，以确保任何资产是页面上引用（CSS，图片，JS等）将适当路径请求。在不支持动态更新到基本元件（如Firefox 3.6）浏览器，jQuery Mobile的遍历所有引用资产的页面和前缀他们 href和SRC与基地路径属性。

问：

¿我是不是做错了¿是一个bug或我missunderstood的documentation¿how我能得到通过AJAX加载有正确的URL的资产？

我想使用jQuery Mobile的页面的导航模式，以在移动浏览器看中的转变。

显示我的代码！：

mydomain.com/mobile/home代码：

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

mydomain.com/mobile/about代码：

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

来源

2011-03-17 Javi Stolz

我有同样的问题，我想我已经找到了解决办法

我相信的jQuery Mobile的基本URL弄乱，我发现，谈论其“基地url管理SISTEM”一些老的文档

http://jquerymobile.com/demos/1.0a1/#docs/pages/docs-navmodel.html

如果您使用的是相对于你的根目录的网址（一个“/”开头）所有图像正确加载..

在使用下面的代码应该工作的情况下

：

<img src="/mobile/logo.png" alt=""/>

我知道这将是更好ŧ Ø有干净的相对URL的，但我不认为jQuery Mobile的支持他们，现在

希望这有助于

来源

2011-05-02 06:26:51 Fortes

感谢您的回答堡垒，但它并没有帮助。我的图像是相对于我的基地网址（ydomain.com/mobile/），这是从我的根目录（ydomain.com/）不同。即使我在开始时将图像src设置为带有“/”的内容，结果也是一样的。 – 2011-05-03 11:23:47

也许你不能使用Base url，因为这些文档说：** jQuery Mobile使用生成的绝对URL路径的组合来管理http请求，并操纵生成的元素的href属性。这两种方法的结合使我们能够创建包含加载页面的完整路径信息的URL，以及正确指导由加载的页面（例如图像和样式表）所做的资产请求的基本元素。** – Fortes 2011-05-27 21:42:26

任何人都知道如何解决这个问题？ – user418775 2011-09-10 15:24:34

创建在服务器端，需要一个相对资产作为参数全局函数和输出的完整路径到文件。在PHP中，是这样的：

function abso($asset){ 
    return "http://ydomain.com/mobile/" . $asset; 
}

然后，在你的jQuery Mobile的页面，你可以写：

<img src="<?= abso('mobile/logo.png');?>" alt=""/>

如果你碰巧使用了一个框架，有可能已经为你的函数。在CodeIgniter中，它是site_url()。

来源

2013-08-21 21:17:11

资产有错误的URL

回答

相关问题