Question

在我的应用程序中，我使用基本标记<base href="http://localhost/app/" />，链接使用相对路径，如下所示：<a href="news/page-1">some link</a>。

首页加载就像一个魅力，但下一个请求尝试加载错误的网址，由firebug测试。

示例：

基地：http://localhost/app/

link 1：news
link 2：about

在第一个请求上，在链接1上，获取正确的网址http://localhost/app/news。

但是在下一个请求中，如果我点击链接2，jquery mobile会尝试加载以下网址：http://localhost/app/news/about

如何处理这个问题？

使用绝对网址不是一种选择。

感谢。

Answer 1

它看起来像一个bug。

这可能是一个修复它。

Github - Fix for issue 613 - Jquery Mobile忽略原始“基础” 标签

Answer 2

我设法使用jQuery本身修复相对链接，将此脚本放在每个页面的底部：

<script type="text/javascript"><!--
 var base = $( 'base' ).attr( 'href' );
 if( base ) {
  // Fix a tags with relative href
  $( 'a[href]' ).filter( function() {
   return ! /^(\w+:|\/)/.test($(this).attr('href'));
  }).each( function() {
   $(this).attr( 'href' , base + $(this).attr( 'href' ) );
  });
 }
//--></script>

它主要执行以下操作：

测试是否有基本标签，在这种情况下：
选择具有属性'href'
过滤掉href为绝对网址的标签（以'scheme：'或'/'开头）
将基础标记添加到href，使其成为绝对

对我来说效果很好。

请注意，它仅适用于以正斜杠结尾的基础href（例如'http://localhost/app/'）。否则，需要对基础变量执行额外的修剪。

我仍然在试图弄清楚如何对图像的来源做同样的事情。尝试使用相同的技术失败，因为在我使用jQuery修复它们之前，似乎img的{{1}} URL被错误地转换为绝对。如果有人发现了一招，请告诉我。同时，我将使用图像的绝对URL ...

jQuery Mobile - 相对链接 - 基本标记错误

2 个答案: