1

当用户将鼠标悬停在网站上的词汇表上时，我正在使用 qTip 来 AJAX 一些内容。有时 AJAX 响应包含指向站点上其他文件的相对链接。问题是 AJAX 响应中的链接尝试从用户所在的当前页面解析，而不是从调用内容的页面。

例子

用户在页面上<site>/topics/flying/missTheGround.html。用户将鼠标悬停在一个术语表上，然后进行 AJAX 调用并从<site>/glossary.html. AJAX 响应具有指向站点中另一个文件的相对链接，例如topics/swimming/drownLess.html. 单击 AJAX 响应中的链接时，它会尝试从当前页面解析，从而导致：<site>/topics/flying/topics/swimming/drownLess.html.

如何修改 AJAX 响应？我需要修改两件事：

  1. 响应中的本地锚链接需要将用户从当前页面重定向到词汇表页面（指向正确的目标）。
    • 查找以“#”开头的 href 并附加一个字符串，将本地目标链接更改为指向<site>/glossary.html#<whatever the link target was>.
  2. 响应中的相对链接需要将用户从当前页面重定向到链接页面的正确位置。
    • 查找以“主题”开头的 href 并附加一个将目标更改为绝对的字符串（从根）<site>/topics/running/goFast.html

我的 AJAX 代码：

content: {
    text: 'Loading...',
    ajax: {
        url: '<local file> #' + $(this).text().toLowerCase(),
        success: function (elems) {
            if (elems.length) {
                this.set('content.text', elems);
                var $elems = $(elems);
            } else {
                this.destroy();
            }
        }
    }
},
4

1 回答 1

1

您可以按如下方式进行两次替换。

替换词汇表：

var glossaryUrl = "<mysite>/glossary.html";
$(elems).find('a[href^="#"]').each(function(i, link) {
    var originalLink = $(link).attr('href');
    $(link).attr('href', glossaryUrl + originalLink);
});

主题是否替换：

var topicsUrl = "<mysite>/";    // The trailing forward slash is important
$(elems).find('a[href^="topics"]').each(function(i, link) { 
    var originalLink = $(link).attr('href');
    $(link).attr('href', topicsUrl + originalLink);
});
于 2013-02-06T22:30:14.733 回答