整体刷新页面,保持层级菜单展开

1、引入jquery.cookie.js

2、点击菜单选项时,将菜单信息记录到cookie中

$.cookie("navstation", $(this).html(), {path: "/"});

3、载入页面时候,处理保存到cookie中的菜单

    var navstation = $.cookie("navstation");
    if(navstation != null){
     $(".leftsidebar_box a").each(function(){
        if($(this).html() == navstation){
        var $dl=$(this).parents("dl");//找到dl节点
        $dl.find("dt").css({"color": "#1ca77b"});//dt颜色发生变化
        $dl.find("img").attr("src","/images/left/select_xl.png");//设置图片
        $dl.find("dd").addClass("menu_chioce").show();
        $(this).parent().addClass("menu_current");
        }
    });

4、遇到问题:关闭浏览器后cookie仍然存在,进入系统可能展示上次点击的菜单

处理方式:在登录的时候清空该cookie,$.cookie("navstation", null, {path: "/"});

时间: 2024-10-11 20:01:51

整体刷新页面,保持层级菜单展开的相关文章

标签点击不返回顶部和不刷新页面方法

让我们先来看看JavaScript中void(0)的含义: JavaScript中void是一个操作符,该操作符指定要计算一个表达式但是不返回值.void 操作符用法格式如下: 1. javascript:void (expression) 2. javascript:void expression expression是一个要计算的 JavaScript 标准的表达式.表达式外侧的圆括号是可选的,但是写上去是一个好习惯.我们可以使用 void 操作符指定超级链接.表达式会被计算但是不会在当前文

手风琴菜单、层级菜单、置顶菜单、无缝滚动的制作

一.手风琴菜单效果图及代码如下: 1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>手风琴效果制作</title> 6 <link rel="stylesheet" href="../css/reset.css"> 7 <styl

整体刷新和局部刷新frameset窗口

在项目中,经常会遇到页面分割,最常见的系统或网站的主界面.主页面分为,上面系统简介.下面作者简介.左边系统功能菜单.右边则是菜单真正展示的界面. 遇到这种这种分割页面,大家首先想到是frameset,使用framset分割多种frame,这种方式简单.若是不喜欢使用framset,喜欢前台设计的人也许会选择div拼接,浮动,这就考查css样式的功底了. 这次主要讲解局部刷新的问题.需求是:左边frame,右边frame. 大家肯定疑问,这样刷新没有问题啊.的确如此.现在使用framset,分割两

ASP.NET—015:ASP.NET中无刷新页面实现

原文作者:杨友山 原文地址:http://blog.csdn.net/yysyangyangyangshan/article/details/39679823 前面也说过在asp.net中前后前交互的问题.使用了ajax.js的方法:$.post和$.ajax. http://blog.csdn.net/yysyangyangyangshan/article/details/22755007和http://blog.csdn.net/yysyangyangyangshan/article/det

刷新页面时 select值保持不变

刷新页面时,要使下拉菜单(select).raido保持不变,用ajax是无法实现的.我想只能通过cookies才能实现.刷新前先把select或radio的值保存在cookies中,刷新后再填回去.下面是测试代码: [html] view plain <select name="sex" id="sex" onchange="save()"> <option  value="01" selected >

jQuery鼠标悬停3d菜单展开动画

效果体验:http://hovertree.com/texiao/jquery/93/ 竖直的主菜单贴着页面左侧,当光标移入菜单项时,以3D动画的方式弹出对应的二级菜单.采用jQuery和CSS3实现.支持Chrome,火狐,Edge等浏览器. 效果图: 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport"

[JavaScript]cookie实现刷新不变化树形菜单

通过设置cookie来保存树形菜单的状态,在页面加载时重新读取cookie来设置菜单. 菜单的HTML结构: 1 <div class="treemenu"> 2 <ul> 3 <li> 4 <a href="#" id="treemenu_a_1">一级菜单一</a> 5 <div class="submenu" id="submenu_1"

刷新页面

定时刷新页面,最常见的有两种实现方式:一种是通过JavaScript+HTMLDOM,另一种则是通过meta标签来实现. 1.JavaScript+HTMLDOM,示例代码如下: 1 2 3 4 functionrefresh(seconds){ setTimeout("self.location.reload()",seconds*1000); } refresh(600);//调用方法启动定时刷新,数值单位:秒. 2.通过meta标签来实现(在页面中添加meta标签refresh也

表格布局扩展/DW设计界面中快速整体布局页面的操作

DW设计界面中快速整体布局页面的操作流程: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta htt