通过 jQuery 使用浏览器历史记录

Question

现在我有一个系统设置，以便人们必须采取某些步骤才能在页面上前进。我只是使用显示隐藏并使用以下方法进行操作：

    function shownext(){
            $(this).next('div').fadeIn(500);
    }

    function showprev(){
            $(this).prev('div').fadeIn(500, backup);
    }

有没有办法获得深层链接，以便用户可以使用浏览器后退按钮返回到上一步？

Answer 1

History.js库使得使用 HTML5 历史记录 API（为缺乏 API 的浏览器提供哈希后备）来完成此类事情变得非常容易。

你可以这样做：

function shownext(){
        $(this).next('div').fadeIn(500);
        // Push state with next page number.
}

function showprev(){
        $(this).prev('div').fadeIn(500, backup);
        // Push state with previous page number.
}

History.Adapter.bind(window,'statechange',function(){
    var State = History.getState();
    goToPage(State.data.page);
}

function goToPage(page)
{
    // Go to page.
}

该库的文档和演示非常有用。