内部链接与jQuery地址

Internal Links with jQuery Address

本文关键字:地址 jQuery 链接 内部      更新时间:2023-09-26

我正试图实现可爱的地址插件来处理内部链接的漂亮链接和使用后退按钮。我设法让它工作,但我注意到的一件事是,当它改变URL从/#部分到/#/部分,如果用户然后复制该URL并试图打开它在一个新的窗口(或发送给朋友)它不带用户到页面上的那个部分。很明显,因为它不再被认为是锚了。

当用户通过URL导航时,我如何让它在正确的部分上?

下面是我按照jQuery地址使用的代码片段:

$('nav a').click(function() { 
    var pageTitle = 'Kevin Dare Foundation | ' + $(this).html(); 
    $.address.value($(this).attr('href').replace(/^#/, ''));
    $.address.title(pageTitle);
});

这里还有一个链接,可以看到它的作用:http://nickdimatteo.com/kjd

最简单的方法可能是在文档加载时触发您的代码,如果有document.location.hash:

$('nav a').click(function() { 
    var pageTitle = 'Kevin Dare Foundation | ' + $(this).html(); 
    $.address.value($(this).attr('href').replace(/^#/, ''));
    $.address.title(pageTitle);
});
$(document).ready(function() {
    var hash = document.location.hash.replace(/^#'//, '');
    if(hash) {
        $('nav a[href="#' + hash + '"]').trigger('click');
    }
});