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 相关文章推荐
Google Map Api和GOOGLE Search Api整合实现代码
Jul 18 Javascript
asp(javascript)全角半角转换代码 dbc2sbc
Aug 06 Javascript
javascript的函数作用域
Nov 12 Javascript
JavaScript判断是否为数组的3种方法及效率比较
Apr 01 Javascript
jQuery Easyui datagrid/treegrid 清空数据
Jul 09 Javascript
js实现常见的工具条效果
Mar 02 Javascript
zTree实现节点修改的实时刷新功能
Mar 20 Javascript
JavaScript正则表达式校验与递归函数实际应用实例解析
Aug 04 Javascript
解决在vue项目中,发版之后,背景图片报错,路径不对的问题
Mar 06 Javascript
VueJS 组件参数名命名与组件属性转化问题
Dec 03 Javascript
[jQuery] 事件和动画详解
Mar 05 jQuery
Vue实现下拉加载更多
May 09 Vue.js
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
一个目录遍历函数
2006/10/09 PHP
怎么使 Mysql 数据同步
2006/10/09 PHP
PHP substr 截取字符串出现乱码问题解决方法[utf8与gb2312]
2011/12/16 PHP
php网页标题中文乱码的有效解决方法
2014/03/05 PHP
去除php注释和去除空格函数分享
2014/03/13 PHP
常见php数据文件缓存类汇总
2014/12/05 PHP
Laravel框架中VerifyCsrfToken报错问题的解决
2017/08/30 PHP
Laravel框架基于中间件实现禁止未登录用户访问页面功能示例
2019/01/17 PHP
Laravel数据库读写分离配置的方法
2019/10/13 PHP
用js生产批量批处理执行命令
2008/07/28 Javascript
Extjs4 GridPanel 的几种样式使用介绍
2013/04/18 Javascript
详解JavaScript的回调函数
2015/11/20 Javascript
全屏js头像上传插件源码高清版
2016/03/29 Javascript
ES6所改良的javascript“缺陷”问题
2016/08/23 Javascript
js点击按钮实现水波纹效果代码(CSS3和Canves)
2016/09/15 Javascript
JS简单生成随机数(随机密码)的方法
2017/05/11 Javascript
JS设计模式之命令模式概念与用法分析
2018/02/06 Javascript
判断iOS、Android以及PC端的示例代码
2018/11/15 Javascript
[02:36]DOTA2英雄基础教程 帕格纳
2014/01/20 DOTA
python实现进程间通信简单实例
2014/07/23 Python
举例区分Python中的浅复制与深复制
2015/07/02 Python
基python实现多线程网页爬虫
2015/09/06 Python
Python实现的中国剩余定理算法示例
2017/08/05 Python
python数据结构之列表和元组的详解
2017/09/23 Python
Python利用递归实现文件的复制方法
2018/10/27 Python
解决django 新增加用户信息出现错误的问题
2019/07/28 Python
python将字母转化为数字实例方法
2019/10/04 Python
Python+unittest+requests+excel实现接口自动化测试框架
2020/12/23 Python
实列教程 一款基于jquery和css3的响应式二级导航菜单
2014/11/13 HTML / CSS
app内嵌H5 webview 本地缓存问题的解决
2020/10/19 HTML / CSS
2019年c语言经典面试题目
2016/08/17 面试题
毕业生找工作的求职信范文
2013/12/24 职场文书
优秀应届毕业生推荐信
2014/02/18 职场文书
企业业务员岗位职责
2014/03/14 职场文书
和谐社区口号
2014/06/19 职场文书
违反纪律检讨书范文
2015/05/07 职场文书