Ajax:更新CSS菜单的最佳做法

时间:2019-04-06 08:20:45

标签: jquery ajax

在我对网站上的主要内容div进行Ajax更新之后,我需要一些有关实现菜单状态更新的指导/建议。

我正在学习Ajax,并使基本站点正常工作。我的页面分为3个部分-头,身体,脚。仅通过Ajax请求刷新身体。我的头中有一个简单的Bootstrap菜单,因此当将新页面的内容加载到正文中以显示新选择的页面时,我需要手动对其进行更新。我是通过jQuery选择器添加/删除活动类来实现的。...

 // intercept main nav. menu links
 $(".nav a").click(function(e) { 
    var id = $(this).attr('id');
    var hr = $(this).attr('href');
    $('ul.nav li.active').removeClass('active');
    $('ul.nav li a#'+id).closest('li').addClass('active');      
    // update link colours
    $('ul.nav li a').css('color', '#9d9d9d');
    $('ul.nav li a#'+id).css('color', '#fff');

    sendRequest(id, hr); // post off my Ajax request
    history.pushState({ident:id, href: hr}, "", hr);

    return false;   // prevent default
  });   

我有类似的代码来拦截window.addEventListener中的浏览器后退/前进按钮,从而给我的网站带来整体的App感觉。这可行,但是我觉得可能有更好的方法吗?欢迎任何意见或评论。谢谢。

0 个答案:

没有答案