javascript - 退回 Javascript 第二阶段的浏览器 'back' 按钮？

Question

我遇到了 nopCommerce 中特定客户要求带来的问题。

我有一个页面 - 比方说 page1 - 它显示了一个 block 图像，然后你必须点击它才能到达页面的主要部分(无论我多么努力劝阻他们不要额外点击他们都是坚定的- 基本上这是在进入主要产品网格/类别页面之前的“迷人镜头”。

我有用于页面加载的 JavaScript:

switch(window.location.pathname) {
    case "/store/page1":
        $(".category-page").hide();
        break;
etc. (there are other functions for other things)

其次是:

    $(".landing_click").click(function () {
        $(".landing_page").hide();
        $(".category-page").show();        
    });

这一切都很好，并在点击主图像后显示产品网格(类别页面)。 但是从网格中查看单个产品(进入产品详细信息)后，单击浏览器上的后退按钮会将您带回到页面的第一阶段1，因此您必须单击启动图像/glamour 再次射击以到达产品网格。

对我来说，这是合乎逻辑的，它正在按预期工作，但我需要找到一种方法，以便当用户单击产品的后退按钮时，它会返回到产品网格。像这样:

这可以用 JavaScript 实现吗？它需要使用浏览器后退按钮而不是特定的其他按钮，尽管我也可以另外添加其中一个按钮。

如果它是一个简单的网站，那将相对容易，但我受限于 nopCommerce 的局限性和类别页面的功能方式，因此，如果可能的话，我为什么要寻找 JavaScript 答案，这样我就可以简单地调整我的内容已经有了。

谢谢

Answer 1

我会像这样使用 location.hash:

switch(window.location.pathname) {
    case "/store/page1":
        if(window.location.hash == "#landing") {
            $(".landing_page").show();
            $(".category-page").hide();
        }
        else {
            $(".landing_page").hide();
            $(".category-page").show();
        }
        break;
    //The rest here
}

其次是:

$(".landing_click").click(function () {
    window.location.hash = "#category";
    $(".landing_page").hide();
    $(".category-page").show();        
});

现在，当您在产品详细信息页面中时，单击后退按钮会将您移至/store/page1#category 直接加载类别页面。