jQuery深度链接

Question

我正在使用下面的代码来制作一些简单的标签，我想知道是否可以编辑这些代码来启用深度链接？我没有使用jQuery UI，也不喜欢使用插件。提前为任何帮助干杯。

  $('#tabber > div').hide(); // Hide all divs

    $('#tabber ul li a').click(function () { // When link is clicked
        $('#tabber ul li').removeClass('active'); // Remove active class from links
        $(this).parent().addClass('active'); //Set parent of clicked link class to active
        var currentTab = $(this).attr('href'); // Set currentTab to value of href attribute
        $('#tabber > div').fadeOut(200); // Hide all divs
        $(currentTab).fadeIn(200); // Show div with id equal to variable currentTab
        return false;
    });

Answer 1

为了保持浏览器的兼容性，我打算使用一个轻量级插件，因为我认为任何其他插件都是错误的：http://benalman.com/projects/jquery-hashchange-plugin/

要实现深度链接，您需要将相关逻辑视为该不同位置(RESTy可寻址)的一部分，而不是尝试对现有动画代码进行某种改造。或者换句话说，哈希变化驱动UI，而不是相反。

使用该插件并更改上面的逻辑，使UI只是一个标准链接(类似于<a href="#tab_foo"...>，然后更改显示逻辑以响应散列更改：

$(window).hashchange(function () {
    $('#tabber ul li').removeClass('active');       
    var currentTab$ = $(location.hash);
    currentTab$.parent().addClass('active');
    $('#tabber > div').fadeOut(200);
    currentTab$.fadeIn(200);
});

根据需要进行调整(其中一些对于实际的DOM当然没有意义)，并在页面加载时触发(以处理深度链接)。