Question

我有这个JS代码，在页面更改时扩展我菜单上的最后一个打开的项目，如果点击页面顶部的图像进入主页，我怎样才能在主页上创建“主页”链接菜单是最后一个活动的点击链接？

<script>
$(document).ready(function(){
    //Loop through nav items, compare to expanded item ID from sessionStorage so we can expand whichever item was previously expanded
    if(sessionStorage.getItem("activeMenuItemID") != undefined){
        $("#nav > li > a").each(function(){
            if ($(this).attr("id") == sessionStorage.getItem("activeMenuItemID")){
                expandMenuItem(this);
            }
        });
    }

    $('#nav > li > a').click(function(elem){
        expandMenuItem(this);
    });

});

function expandMenuItem(elem){
    if ($(elem).attr('class') != 'active'){
        $('#nav li ul').slideUp();
        $('#nav > li > a').removeClass("active");
        $(elem).addClass("active");
        $(elem).next().slideToggle();
        sessionStorage.setItem("activeMenuItemID", $(elem).attr("id"));
    }
}
</script>

顶部的图像根本不是菜单的一部分

Answer 1

查看这个小提琴手Here

好的，这里有一些你不知道的东西，我已修复你的代码只是想让你知道。

expandMenuItem是否存在全局范围？这可能很糟糕，因为现在没有其他人可以声明一个名为expandMenuItem的函数？也许在你的项目范围之外只需考虑一下。

尽量不要在js中使用==，因为它的含义与你想象的不同，使用===反而更加安全。 jquery有一个hasClass函数，它将检查一个元素是否有一个类。 $(elem).attr('class') != 'active'很糟糕，因为如果它有两个类，你就是SOL。

当在同一函数中询问相同的元素时，尝试将其保存到变量中。我注意到$（elem）被击中了几次。这可能会导致问题，因为您不断向文档询问元素，只需将其保存在变量中，这样您就不必继续打扰文档。你的选择器也是#nav＆gt; li>一个是不正确的。您可能想要查找＆gt;对于选择器我也改变了它。

希望这有用。

Javascript sessionStorage将最后选择的项目作为单击图像链接时的第一项

1 个答案: