jQuery Mobile - 相对链接 - 基本标签错误答案

【问题标题】：jQuery Mobile - Relative links - base tag bugjQuery Mobile - 相对链接 - 基本标签错误
【发布时间】：2011-10-24 22:36:30
【问题描述】：

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

第一个页面加载就像一个魅力，但下一个请求尝试加载错误的 URL，由 firebug 测试。

例子：

基地：http://localhost/app/

链接1：新闻
链接2：关于

在第一次请求时，在链接 1 上，获取正确的 url，http://localhost/app/news。

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

如何处理这个问题？

不能使用绝对网址。

谢谢。

【问题讨论】：

标签： jquery ajax mobile base

【解决方案1】：

它看起来像一个错误。

这可能是一个修复它。

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

【讨论】：

【解决方案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>

它基本上做了以下事情：

测试是否有base标签，在这种情况下：
选择每个具有“href”属性的“a”标签
过滤掉 href 为绝对 URL（以“scheme:”或“/”开头）的标签
将基本标记添加到 href，使其成为绝对标记

对我来说效果很好。

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

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

【讨论】：