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 相关文章推荐
如何实现浏览器上的右键菜单
Jul 10 Javascript
js Dialog 实践分享
Oct 22 Javascript
jquery中.add()的使用分析
Apr 26 Javascript
JSCode all of Brower 全局屏蔽网页右键功能 具体实现
Jun 05 Javascript
JavaScript DOM 编程艺术(第2版)读书笔记(JavaScript的最佳实践)
Oct 01 Javascript
Jquery判断radio、selelct、checkbox是否选中及获取选中值方法总结
Apr 15 Javascript
AngularJS 日期格式化详解
Dec 23 Javascript
详解js的事件代理(委托)
Dec 22 Javascript
使用jQuery卸载全部事件的思路详解
Apr 03 jQuery
vue脚手架vue-cli的学习使用教程
Jun 06 Javascript
IScroll5实现下拉刷新上拉加载的功能实例
Aug 11 Javascript
快速了解vue-cli 3.0 新特性
Feb 28 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
法压式咖啡之制作法
2021/03/03 冲泡冲煮
XAMPP安装与使用方法详细解析
2013/11/27 PHP
PHP内置的Math函数效率测试
2014/12/01 PHP
浅谈PHP中Stream(流)
2015/06/08 PHP
PHP常用函数之获取汉字首字母功能示例
2019/10/21 PHP
php桥接模式应用案例分析
2019/10/23 PHP
Thinkphp框架使用list_to_tree 实现无限级分类列出所有节点示例
2020/04/04 PHP
html下载本地
2006/06/19 Javascript
Jquery 设置标题的自动翻转
2009/10/03 Javascript
理解Javascript_13_执行模型详解
2010/10/20 Javascript
js 可拖动列表实现代码
2011/12/13 Javascript
Javascript开发之三数组对象实例介绍
2012/11/12 Javascript
JavaScript调用ajax获取文本文件内容实现代码
2014/03/28 Javascript
我的Node.js学习之路(三)--node.js作用、回调、同步和异步代码 以及事件循环
2014/07/06 Javascript
JS实现动态生成表格并提交表格数据向后端
2020/11/25 Javascript
springMVC结合AjaxForm上传文件
2016/07/12 Javascript
jQuery插件学习教程之SlidesJs轮播+Validation验证
2016/07/12 Javascript
完美解决JS文件页面加载时的阻塞问题
2016/12/18 Javascript
基于javascript 显式转换与隐式转换(详解)
2017/12/15 Javascript
AngularJS实现的简单拖拽功能示例
2018/01/02 Javascript
详解JavaScript的变量
2019/04/04 Javascript
记录vue项目中遇到的一点小问题
2019/05/14 Javascript
jquery ui 实现 tab标签功能示例【测试可用】
2019/07/25 jQuery
JavaScript 引用类型实例详解【数组、对象、严格模式等】
2020/05/13 Javascript
Python安装Imaging报错:The _imaging C module is not installed问题解决方法
2014/08/22 Python
Python数据结构与算法之图的广度优先与深度优先搜索算法示例
2017/12/14 Python
解决python写入mysql中datetime类型遇到的问题
2018/06/21 Python
在django view中给form传入参数的例子
2019/07/19 Python
Python图像处理之图片文字识别功能(OCR)
2019/07/30 Python
python右对齐的实例方法
2020/07/05 Python
Pat McGrath Labs官网:世界上最有影响力的化妆师推出的彩妆品牌
2018/01/07 全球购物
Smallable意大利家庭概念店:设计师童装及家居装饰
2018/01/08 全球购物
澳大利亚百货商店中销量第一的商务衬衫品牌:Van Heusen
2018/07/26 全球购物
房地产公司见习自我鉴定
2014/04/28 职场文书
会计试用期自我评价
2014/09/19 职场文书
邀请函模板
2015/02/02 职场文书