链接到动态锚点

时间:2013-02-08 00:08:36

标签: javascript anchor deep-linking dynamic-content

我有一个json数组的讲师数据,它们被输入模板并为每个讲师生成一张“卡片”。每个教师都包含一个命名锚点,我希望能够从外部页面链接到各种生成的锚点。即instructors.htm#MrsTaylorGreen

似乎在卡片有机会生成时,所有浏览器的跳转到锚点的行为都已完成。

我正在考虑从here

派生的这一点jQuery
// page load, draw instructor cards then...
// scroll to the named anchor if there is one
var anchor = document.location.href.split("#")[1];
if($("#" + anchor).length)
    $('html, body').animate({
        scrollTop: $("#" + anchor).offset().top
    }, 2000);

这有必要吗?或者是否有更有效的替代方案来链接到动态锚点?

1 个答案:

答案 0 :(得分:2)

使用它来获取哈希值(对于你的锚点):

var anchor = window.location.hash;

然后:

if ($(anchor).length > 0)
    $('html, body').animate({
    scrollTop: $(anchor).offset().top
}, 2000);

如果URL中没有散列,则获取散列document.location.href.split("#")[1];的方式会(并且将会)产生错误;因为在这种情况下,数组(来自拆分)只有一个元素。