JS 参数传递的实际应用代码分析


Posted in Javascript onSeptember 13, 2009

原因很简单,在DOM中没有id为msg_box的div标签,该怎么解决这个问题呢?
方案:
在所有页面公用的头部文件header.tpl.html中写入:

<script> 
function changMenu(index){ 
if(typeof getElementById("msg_box") == "object"){ 
//如果存在msg_box对象 则刷新该页的对象 
showMenu(index); 
}else{ 
//如果不存在 则重定向到使用Ajax刷新的页面 
window.location = "/index.html"; 
} 
} 
</script>

但是该项目index.html存在四个相同性质的页面,都需要Ajax来刷新,这样就存在一个问题,当用户点击第三个栏目时,虽然可以回到index.html,但是无法刷新内容到第三个栏目。这时有两种解决方案:
方案1:
第一步:
在所有页面公用的头部文件header.tpl.html中写入:
<script> 
function changMenu(index){ 
if(typeof getElementById("msg_box") == "object"){ 
//如果存在msg_box对象 则刷新该页的对象 
showMenu(index); 
}else{ 
//如果不存在 则重定向到使用Ajax刷新的页面 
window.location = "/index.html?type="+index; 
} 
} 
</script>

第二步:
改进showMenu函数
function showMenu(index){ 
if(typeof getElementById("msg_box") == "object"){ 
//如果存在msg_box对象 则刷新该页的对象 
...... 
}else{ 
url = window.location.href; 
reg = /^(.*)\/index\.html\?type\=\d$/gi; 
if(reg.test(url)){ 
//如果符合传参数页面的url。则获取该参数 
index = url.substr(url.length - 1); 
...... 
} 
} 
}

方案2:
调用JS的cookie功能传递参数
在所有页面公用的头部文件header.tpl.html中写入:
<script> 
function changMenu(){ 
index = getCookie("index"); 
if(index == null) index = 1; 
if(typeof getElementById("msg_box") == "object"){ 
//如果存在msg_box对象 则刷新该页的对象 
showMenu(index); 
}else{ 
setCookie("index", index); 
//如果不存在 则重定向到使用Ajax刷新的页面 
window.location = "/index.html"; 
} 
} 
function setCookie(name, value){ 
 var Then = new Date()
 
 Then.setTime(Then.getTime() + 1*3600000 ) //小时
 
 document.cookie = name+"="+value+";expires="+Then.toGMTString();
 
} 
function getCookie(name) 
{ 
var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)")); 
if(arr != null) return unescape(arr[2]); return null; 
} 
  
</script>
Javascript 相关文章推荐
jQuery 顺便学习下CSS选择器 奇偶匹配nth-child(even)
May 24 Javascript
jQuery实现的Email中的收件人效果(按del键删除)
Mar 20 Javascript
页面回到顶部的三种实现(锚标记,js)
Oct 01 Javascript
关于JavaScript中的关联数组分析
Apr 09 Javascript
jquery制作多功能轮播图插件
Apr 02 Javascript
基于JavaScript将表单序列化类型的数据转化成对象的处理(允许对象中包含对象)
Dec 28 Javascript
全面解析JavaScript中的valueOf与toString方法(推荐)
Jun 14 Javascript
Bootstrap企业网站实战项目4
Oct 14 Javascript
jQuery实现字符串全部替换的方法
Dec 12 Javascript
vue.js全局API之nextTick全面解析
Jul 07 Javascript
bootstrap Table服务端处理分页(后台是.net)
Oct 19 Javascript
node中使用shell脚本的方法步骤
Mar 23 Javascript
javascript类继承机制的原理分析
Sep 12 #Javascript
javascript 类定义的4种方法
Sep 12 #Javascript
一个简单的javascript类定义例子
Sep 12 #Javascript
一个简单的JavaScript 日期计算算法
Sep 11 #Javascript
关于javascript 回调函数中变量作用域的讨论
Sep 11 #Javascript
javascript 一些用法小结
Sep 11 #Javascript
JS 日期验证正则附asp日期格式化函数
Sep 11 #Javascript
You might like
比较简单的百度网盘文件直链PHP代码
2013/03/24 PHP
PHP获取一个字符串中间一部分字符的方法
2014/08/19 PHP
ThinkPHP 404页面的设置方法
2015/01/14 PHP
非常实用的php验证码类
2016/05/15 PHP
使用XHProf查找PHP性能瓶颈的实例
2017/12/13 PHP
PHP PDOStatement::execute讲解
2019/01/31 PHP
one.php 多项目、函数库、类库 统一为一个版本的方法
2020/08/24 PHP
PHP dirname简单使用代码实例
2020/11/13 PHP
jquery isEmptyObject判断是否为空对象的函数
2011/02/14 Javascript
JSON传递bool类型数据的处理方式介绍
2013/09/18 Javascript
node.js中的path.delimiter方法使用说明
2014/12/09 Javascript
无缝滚动的简单实现代码(推荐)
2016/06/07 Javascript
基于JQuery实现分隔条的功能
2016/06/17 Javascript
javascript 中Cookie读、写与删除操作
2017/03/29 Javascript
javascript获取图片的top N主色值方法详解
2018/01/26 Javascript
浅谈Angular 观察者模式理解
2018/11/01 Javascript
详解Vue.js v-for不支持IE9的解决方法
2018/12/29 Javascript
npm 常用命令详解(小结)
2019/01/17 Javascript
React 实现车牌键盘的示例代码
2019/12/20 Javascript
webpack的 rquire.context用法实现工程自动化的方法
2020/02/07 Javascript
python输入多行字符串的方法总结
2019/07/02 Python
ML神器:sklearn的快速使用及入门
2019/07/11 Python
Python对称的二叉树多种思路实现方法
2020/02/28 Python
使用IPython或Spyder将省略号表示的内容完整输出
2020/04/20 Python
CSS3美化表单控件全集
2016/06/29 HTML / CSS
在线课程:Skillshare
2019/04/02 全球购物
函授大专自我鉴定
2013/11/01 职场文书
京剧自荐信
2014/01/26 职场文书
三年级科学教学反思
2014/01/29 职场文书
反腐倡廉警示教育活动总结
2014/05/05 职场文书
北京奥运会口号
2014/06/21 职场文书
党员四风问题对照检查材料
2014/09/27 职场文书
护士年终考核评语
2014/12/31 职场文书
成本会计岗位职责
2015/02/03 职场文书
小学六年级班主任工作经验交流材料
2015/11/02 职场文书
Python Django模型详解
2021/10/05 Python