History.js无法恢复到空状态

时间:2012-10-03 17:33:50

标签: javascript history.js

我正在使用一个图库查看器,我使用History.js来获得一个很好的链接。 这是流程:

http://foo.com/gallery/show/显示主画廊

http://foo.com/gallery/show/photo1向观众展示了照片

所以我使用History.pushState({},“photo1”)从show / to show / photo1

我的问题是,当我关闭查看器时,我希望网址返回显示/所以我尝试了: History.pushState({},“”)但这不起作用它只停留在show / photo1。

顺便说一下,我真的不想使用History.go(-X),在这个用例中我似乎不合逻辑。

我该怎么做? 谢谢

1 个答案:

答案 0 :(得分:1)

HTML:

<html>
<head>
</head>
<body>
    <a class='img' href="img1">Image 1</a>
    <a class='img' href="img2">Image 2</a>
    <div class="image-viewer" style="display:none"><p></p>
    <a class="close" href="">Close</a>
    </div>
</body>
</html>
​

JS:

$(function() {
var begin=location.href;
$(".img").on('click', function(e) {
    console.log(location.href);
    var href = $(this).attr("href")
    History.pushState({"state": href, "rand": Math.random()}, "", href);
        console.log(location.href);
     e.preventDefault();
});

History.Adapter.bind(window, 'statechange', function() {
    $(".image-viewer p").html(History.getState());
    $(".image-viewer").show();
});

$(".close").click( function(e) {
    e.preventDefault();
    console.log($(this).parent());
    $(this).parent().fadeOut(1);
    History.pushState({"state": begin, "rand": Math.random()}, "", begin);
});
​})

http://jsfiddle.net/rAxAw/2/

如果需要进一步帮助,请随时询问任何q-n