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加载页面的方法(页面加载完成就执行)
Jun 21 Javascript
js实现动态改变字体大小代码
Jan 02 Javascript
javascript去除空格方法小结
May 21 Javascript
使用Node.js配合Nginx实现高负载网络
Jun 28 Javascript
jquery validate和jquery form 插件组合实现验证表单后AJAX提交
Aug 26 Javascript
JS取数字小数点后两位或n位的简单方法
Oct 24 Javascript
jQuery实现checkbox列表的全选、反选功能
Nov 24 Javascript
Javascript中click与blur事件的顺序详析
Apr 25 Javascript
详解JS获取HTML DOM元素的8种方法
Jun 17 Javascript
weebox弹出窗口不居中显示的解决方法
Nov 27 Javascript
JavaScript页面加载事件实例讲解
Sep 01 Javascript
浅谈Vue组件单元测试究竟测试什么
Feb 05 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编码规范之注释和文件结构说明
2010/07/09 PHP
PHP中source #N问题的解决方法
2014/01/27 PHP
PHP转换文本框内容为HTML格式的方法
2016/07/20 PHP
Yii2创建控制器(createController)方法详解
2016/07/23 PHP
Smarty日期时间操作方法示例
2016/11/15 PHP
laravel 实现划分admin和home 模块分组
2019/10/15 PHP
PHP实现提取多维数组指定一列的方法总结
2019/12/04 PHP
jQuery EasyUI API 中文文档 - ValidateBox验证框
2011/10/06 Javascript
Node.js中对通用模块的封装方法
2014/06/06 Javascript
JQEasy-ui在IE9以下版本中二次加载的问题分析及处理方法
2014/06/23 Javascript
详细分析JavaScript函数定义
2015/07/16 Javascript
javascript日期处理函数,性能优化批处理
2015/09/06 Javascript
基于Vue.js的表格分页组件
2016/05/22 Javascript
js模糊查询实例分享
2016/12/26 Javascript
vue-cli + sass 的正确打开方式图文详解
2017/10/27 Javascript
Bootbox将后台JSON数据填充Form表单的实例代码
2018/09/10 Javascript
详解如何使用koa实现socket.io官网的例子
2018/11/04 Javascript
一分钟学会JavaScript中的try-catch
2020/12/14 Javascript
[01:10:48]完美世界DOTA2联赛PWL S2 GXR vs PXG 第一场 11.18
2020/11/18 DOTA
python模块之re正则表达式详解
2017/02/03 Python
Python常见内置高效率函数用法示例
2018/07/31 Python
Form表单及django的form表单的补充
2019/07/25 Python
numpy 返回函数的上三角矩阵实例
2019/11/25 Python
python判断两个序列的成员是否一样的实例代码
2020/03/01 Python
浅谈在JupyterNotebook下导入自己的模块的问题
2020/04/16 Python
python编写softmax函数、交叉熵函数实例
2020/06/11 Python
Python APScheduler执行使用方法详解
2020/12/10 Python
Python使用pyenv实现多环境管理
2021/02/05 Python
瑞士灯具购物网站:Lampenwelt.ch
2018/07/08 全球购物
印尼网上商店:Alfacart.com
2019/03/11 全球购物
留学自荐信的技巧
2013/10/17 职场文书
继承权公证书
2014/04/09 职场文书
2016学校元旦晚会经典开场白台词
2015/12/03 职场文书
文书工作总结(范文)
2019/07/11 职场文书
描写九月优美句子(39条)
2019/09/11 职场文书
Python基本的内置数据类型及使用方法
2022/04/13 Python