利用js跨页面保存变量做菜单的方法
最近公司在做一个项目，其中一块头部的菜单导航区，要求实现进入相关页面后上面的导航菜单图片也需变换．而这个对于静态页面或者用框架或iframe的来说是很容易实现的．而我们是利用include来包含进的这个top.asp．虽然可以在那个图片菜单上定义onclick的动作属性．但是只要一跳转页面，则这个onclick动作就没用了．因为top.asp被重新加载了．如果要解决这个问题，只能是在页面加载时能读取一个全局的变量，相对于浏览器的全局变量，通过这个变量的值来判断应该如何显示这个导航菜单．于是也便有了本文．
我想到的解决方法有两种：
１．利用cookies或session，在每个页面加载时写一个cookies或session变量，这个看似能很好的解决问题．但是却出现了一个问题．那就是如果用户禁止了cookies，则这个效果将无法实现，永远只是显示默认效果．所以我放弃这种做法
２．利用history或navigator来建立这么一个相对于浏览器的变量．只要我浏览器没关，则这个变量就会持续存在．这样就达到了我们想要的效果．我也是用这种方法来解决的．下面是具体实现部分．
<script type="text/JavaScript"> function init(){ //初始化函数 //如果history.dmenu没有定义则设置为１即显示首页按扭的效果 function menushow(d_id){ switch(d_id){ //--> </table></td> |
这种的效果如下：
先看首页：
再看按下订单查看按钮后的效果:我用的触发脚本是在上面代码中的onclick="menushow(2)"即传递一个2做为实参，从而设置history.dmenu=2这样在页面刷新加载时就会判断出当前状态了．因为这个变量是相对于浏览器的．效果如下:
今天测试时发现了一个问题，得用上面写的方法时对ＩＥ不支持，在火狐上没有问题，所以对程序进行了下小修改．过程是这样的．对于ＩＥ浏览器使用session来判断，每按一个按钮时就写一个session("dmenu")为相应的值，然后把这个值写在页面的一个隐藏域里，然后在页面初始化时判断是使用的什么类型浏览器，如果是ＩＥ的就执行通过session来判断的函数，而这个session则是通过获取那个隐藏域里的值，而如果是非ＩＥ浏览器就运用上面我昨天写的也就是上面的init函数来进行．判断代码如下： <script language="javascript"> } 如此一来就完美的解决了这个问题．也许有朋友会说用session就可以了，但经过我的实验是用session火狐的根本不认，我也不知道什么原因，所以只好用我这个方法了．如果你有好方法请告诉我． |
相关推荐
-
js中定义一个变量并判断其是否为空的方法
js中定义一个变量 var params=null;判断params不为空的方法: 复制代码 代码如下: if(params && params.hasOwnProperty("name")){} 其中:console.info(params);//结果为:Object {}
-
Jquery和JS用外部变量获取Ajax返回的参数值的方法实例(超简单)
以前只知道在返回data区域赋给html控件值,后来发现,原来直接定义变量就行了. 复制代码 代码如下: var csj_data; $.ajax ({ cache: false, async: false, type: 'post', data: { aaa: "1" }, url: "../handle/Ladder_Fee_Code.ashx?ajaxac
-
浅析js中取绝对值的2种方法
1.abs() var aaa=-20; var bbb=Math.abs(aaa); 2.加减法 var aaa=-20; var bbb=-aaa
-
js中取得变量绝对值的方法
本文实例讲述了js中取得变量绝对值的方法.分享给大家供大家参考.具体分析如下: 绝对值在js中我们直接使用abs函数来求,这里就来整理一些关于js中取得变量的绝对值的方法,以便让大家更深入的理解js绝对值的用法 js中的绝对值不怎么常用到,今天在写一个方法的时候遇到了,于是记录下来,与大家共同学习. js中的默认对象--Math对象下面有一个abs函数,专门用来获取数字的绝对值,如: 复制代码 代码如下: Math.abs(-1); //1 Math.abs(-2); //2 当然,这个函数
-
flash调用js中的方法,让js传递变量给flash的办法及思路
html 页中的 JavaScript 函数: 复制代码 代码如下: function GetSwfUrl(){var pics1 = parseInt(Math.random()*5)+1;var pics2 = parseInt(Math.random()*5)+1;document.my_swfId.SetVariable("pic01Num", pics1);document.my_swfId.SetVariable("pic02Num", pics2);}
-
asp.net后台cs中的JSON格式变量在前台Js中调用方法(前后台示例代码)
复制代码 代码如下: //后台cs代码: using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.UI; using System.Web.UI.WebControls; public partial class Login_jg : System.Web.UI.Page { protected void Page_Load(object sende
-
JS根据变量保存方法名并执行方法示例
复制代码 代码如下: function a(){ alert("fun a()"); } function b(){ alert("fun b()"); } var methodName = ""; //method1 methodName = "a"; function method1(methodName){ //初始化this.func属性, this.func = function(){}; try{ //这里用eva
-
利用js跨页面保存变量做菜单的方法
最近公司在做一个项目,其中一块头部的菜单导航区,要求实现进入相关页面后上面的导航菜单图片也需变换．而这个对于静态页面或者用框架或iframe的来说是很容易实现的．而我们是利用include来包含进的这个top.asp．虽然可以在那个图片菜单上定义onclick的动作属性．但是只要一跳转页面,则这个onclick动作就没用了．因为top.asp被重新加载了．如果要解决这个问题,只能是在页面加载时能读取一个全局的变量,相对于浏览器的全局变量,通过这个变量的值来判断应该如何显示这个导航菜单．于是也便有
-
JS中跨页面调用变量和函数的方法(例如a.js 和 b.js中互相调用)
在项目开发过程中,也许你会遇这样的情况. 在某一Js文件中需要完成某一功能,但这一功能的大部分代码在另外一个Js文件中已经完成了,自己只需要调用这个方法再加上几句代码就可以实现所需的功能. 我们知道,在html中,利用<script language="javascript" type="text/javascript" src="./script.js"></script>引入的两个js是不可以相互调用的.那么该如何解决
-
解决ajax不能访问本地文件问题（利用js跨域原理）
博主自己在开发一个无后台,只有前台的查询系统时,遇到一个困难,如何利用Ajax读取自己的本地json文件,百度.谷歌了下,发现大部分文章都是在说修改浏览器参数,但是自己想想,用户在使用时,还要修改浏览器的参数,这样显然降低了用户体验.自己琢磨了一段时间,发现可以利用js跨域原理来解决这个瓶颈.将之前要读取的json文件,变为js对象文件,这样就可以读取这个文件,然后写一个函数来对这个js对象进行解析. 首先说明下js跨域原理和jsonp这个技术(如果说的不详细,可自行百度.谷歌) src可以跨域
-
利用JS实现页面删除并重新排序功能
首先,用jqury选择器,选中勾选的行: var cks = $("#indicator_table").find("input[type='checkbox']:checked"); 然后弹出一个确认是否删除框,为是否删除框中的确定绑定一个delInd()事件: 先在页面把选中的那一行,remove或者html(" ")掉, $("#indicator_table").find("input[type='check
-
利用JS屏蔽页面中的Enter按键提交表单的方法
如在设置了JS代码响应<p>标签的Enter按键触发事件时,根据冒泡型事件原则该事件会一直传到<from>表单处,并将表单提交.这不是我们想要的效果,我们可以设置如下代码来加以屏蔽: $(document).keydown(function(event){ switch(event.keyCode){ case 13:return false; } }); 但是,如果页面中有按钮时在Opera浏览器中同样会提交表单,这是因为按钮在生成的HTML代码中是submit类型的,解决办法是
-
JS遍历页面所有对象属性及实现方法
for...in循环的Javascript示例: <html> <head> <title>一个使用到for...in循环的Javascript示例</title> </head> <body> <script type="text/javascript"> // 创建一个对象 myObject 以及三个属性 sitename, siteurl, sitecontent. var myObject =
-
js实现简单折叠、展开菜单的方法
本文实例讲述了js实现简单折叠.展开菜单的方法.分享给大家供大家参考.具体如下: 这里介绍的是意乱会折叠.展开的菜单导航栏,很老时候写的,CSS没有做美化,如果想用的朋友就自己美化吧. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-simple-hidden-show-menu-codes/ 具体代码如下: <html> <script> function show(c_Str) {if(document.all(c_Str
-
js 取消页面可以选中文字的功能方法
需求 有时候需要做的仿软件的功能,就需要取消可以选中文字的功能.这个功能浏览器默认开启,我们就可以使用js取消掉该功能. 代码 document.onselectstart = function(){return false;}; //取消字段选择功能 只要把这一句话放到页面里面,就可以取消掉字段选择功能. 以上这篇js 取消页面可以选中文字的功能方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.
-
js实现页面跳转的五种方法推荐
js实现页面跳转的五种方法推荐 第一种: 复制代码 代码如下: <script language="javascript" type="text/javascript"> window.location.href="xx.jsp?backurl="+window.location.href; </script> 第二种: 复制代码 代码如下: <script language="javascript&quo
-
js实现多选项切换导航菜单的方法
本文实例讲述了js实现多选项切换导航菜单的方法.分享给大家供大家参考.具体实现方法如下: 复制代码 代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>多选项切换导航菜单</title> </head> <style type="text/c