Question

我有这个代码，但当我点击浏览器中的后退按钮时，菜单仍然可见，它的课程仍然是'show'

$("#courses > a,#masterclasses > a,#the-team > a").click(function (e) {                                                            
    e.preventDefault();
});
$('#courses > a,#courses-nav').hover(function(){
    $('#courses-nav').addClass('show');
    $('#courses > a').css('color','#43b2b0');
},function(){
    $('#courses-nav').removeClass('show');
    if ($('body').hasClass('courses')) {
        $('#courses > a').css('color','#43b2b0');
        }
        else {
        $('#courses > a').css('color','#000');
    }
});

我试过添加这个...... $（ '＃课程-NAV，＃大师-NAV，＃的团队-NAV'）removeClass（ '秀'）。 ......但这并不能解决问题。

感谢您解决此问题的任何帮助。

C

Answer 1

是的，当你使用后退和前进按钮时，今天的浏览器实际上并没有重新加载页面。相反，他们保留旧页面，在离开时隐藏它，并在重新进入页面时重新显示它。这样可以更快地进行后退/前进导航，并且意味着当您返回时，页面将处于完全相同的状态，就像您离开时一样。 Firefox中的About the bfcache。

您可以捕获pageshow事件并使用它取消中间操作，而不会完全打破bfcache（通常通过添加unload事件处理程序来完成）。

对于悬停，您可能最好使用普通的CSS :hover而不是脚本。它只有IE6才能使用。同样，无论是使用脚本还是 CSS，悬停菜单都具有相当棘手的可用性和可访问性问题。

jquery悬停菜单和后退按钮

1 个答案: