从谷歌点击时使子页面处于活动状态

Question

我有一个有效的垂直手风琴菜单，它创建一个活动类并在整个网站中从一个页面移动到另一个页面时保存。我遇到的问题是，例如，当我从谷歌转到子页面时，手风琴菜单不会下拉并显示该活动类。

当我从一个页面转到另一个页面时，我使用 cookie 来保存课程。当我从谷歌搜索时，我会使用类似的技术来捕获它所在的页面吗？

http://jsfiddle.net/tebrown/uzrbbqx9/4/

    $('#cssmenu > li:has(ul)').addClass("has-sub");

    var checkCookie = $.cookie("nav-item");
    if (checkCookie != "") {
        $('#cssmenu > li > a:eq(' + checkCookie + ')').addClass('active').next().show();
    }
    checkCookie = $.cookie("sub_nav-item");
    if (checkCookie != "") {
        $('#cssmenu > li > ul > li > a:eq(' + checkCookie + ')').addClass('active').next().show();
    }


    $('#cssmenu > li > ul > li > a').click(function () {
        var navIndex = $('#cssmenu > li > ul > li > a').index(this);
        $.cookie("sub_nav-item", navIndex);
        var checkElement = $(this).next();


        $(this).removeClass('testing');
        $(this).closest('li').addClass('testing');
        $('#cssmenu li li .active').removeClass('active');
        $(this).addClass('active');
    });

    $('#cssmenu > li > a').click(function () {
        var $a = $(this),
            $ul = $a.next(),
            navIndex = $('#cssmenu > li > a').index(this);

        $.cookie("nav-item", navIndex);
        $('#cssmenu li a.active').not(this).removeClass('active').next().stop().slideUp();

        if ($ul.is(':animated'))
            return;

        $ul.stop().slideToggle();
        $a.toggleClass('active');

        });

任何帮助将不胜感激。

干杯

Answer 1

让我们关注 3 个解决方案：

Cookie

对我来说最糟糕的解决方案。它有很多有争议的情况：

• 假设我们在页面 A，然后我们使用菜单转到页面 B（仍然可以正常工作）。当我们使用另一个链接（外部菜单）返回页面 A 时是什么情况？
• 我们从谷歌访问页面或只是更改浏览器中的 url - 我们如何检测活动页面？

窗口位置

通过比较 url (window.location == a[href]) 检测活动菜单项。

更好，但是...

• 我们可以拥有与菜单链接href 不同url 的页面，但它仍然是本节的子页面。再次 - 如何检测它？

硬编码

在每个视图中定义活动菜单项。

最好的解决方案，但如果以错误的方式完成也会很痛苦。

---

答案

回到您的问题 - 您可以结合最后两种方法。只需获取页面 url（窗口位置解决方案的一部分）并创建类似“网站地图”的内容（最后一个解决方案的一部分，但您可以在一个 js 文件中定义它）：

{
    'url_1': 'active_menu_item',
    'url_2': 'another_active_menu_item',
    'maybe_some_[regexp]+`: '???',
    ...
}

或在视图顶部定义这些变量（checkCookie 和 e.q.checkCookieSub）。

那么 cookie 在哪里呢？抱歉，我找不到改进这种 cookie 方法的方法（我们可以通过多种方式浏览网站，它们无用且最痛苦）:)