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 相关文章推荐
分享14个很酷的jQuery导航菜单插件
Apr 25 Javascript
js 限制数字 js限制输入实现代码
Dec 04 Javascript
原生js实现淘宝首页点击按钮缓慢回到顶部效果
Apr 06 Javascript
浅谈nodeName,nodeValue,nodeType,typeof 的区别
Jan 13 Javascript
Bootstrap每天必学之简单入门
Nov 19 Javascript
JavaScript动态添加css样式和script标签
Jul 19 Javascript
js中string和number类型互转换技巧(分享)
Nov 28 Javascript
基于js中的存储键值对以及注意事项介绍
Mar 30 Javascript
angularjs http与后台交互的实现示例
Dec 21 Javascript
JavaScript内置对象math,global功能与用法实例分析
Jun 10 Javascript
Vue退出登录时清空缓存的实现
Nov 12 Javascript
webpack打包html里面img后src为“[object Module]”问题
Dec 22 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 处理图片的类实现代码
2009/10/23 PHP
PHP strip_tags()去除HTML、XML以及PHP的标签介绍
2014/02/18 PHP
php+ajax登录跳转登录实现思路
2016/07/31 PHP
php微信开发之图片回复功能
2018/06/14 PHP
PHP回调函数简单用法示例
2019/05/08 PHP
jQuery 1.0.2
2006/10/11 Javascript
详解new function(){}和function(){}() 区别分析
2008/03/22 Javascript
jQuery 标题的自动翻转实现代码
2009/10/14 Javascript
jQuery实现的Email中的收件人效果(按del键删除)
2011/03/20 Javascript
JavaScript实现的背景自动变色代码
2015/10/17 Javascript
JS运动相关知识点小结(附弹性运动示例)
2016/01/08 Javascript
javascript图片切换综合实例(循环切换、顺序切换)
2016/01/13 Javascript
js删除Array数组中指定元素的两种方法
2016/08/03 Javascript
js基础之DOM中元素对象的属性方法详解
2016/10/28 Javascript
jQuery插件FusionCharts绘制的3D饼状图效果实例【附demo源码下载】
2017/03/03 Javascript
php简单数据库操作类的封装
2017/06/08 Javascript
vue2中的keep-alive使用总结及注意事项
2017/12/21 Javascript
[01:15]PWL S2开团时刻第二期——他们杀 我就白给
2020/11/25 DOTA
python网络编程之文件下载实例分析
2015/05/20 Python
Numpy array数据的增、删、改、查实例
2018/06/04 Python
Python开发的十个小贴士和技巧及长常犯错误
2018/09/27 Python
Python动态语言与鸭子类型详解
2019/07/01 Python
对python特殊函数 __call__()的使用详解
2019/07/02 Python
Python numpy线性代数用法实例解析
2019/11/15 Python
Python 私有化操作实例分析
2019/11/21 Python
Windows+Anaconda3+PyTorch+PyCharm的安装教程图文详解
2020/04/03 Python
css3 media 响应式布局的简单实例
2016/08/03 HTML / CSS
戴森西班牙官网:Dyson西班牙
2020/02/04 全球购物
大学生职业规划前言模板
2013/12/27 职场文书
销售个人求职信范文
2014/04/28 职场文书
绿色环保演讲稿
2014/05/10 职场文书
年度评优评先方案
2014/06/03 职场文书
药品营销策划方案
2014/06/15 职场文书
2014年招商引资工作总结
2014/11/22 职场文书
个人求职自荐信范文
2015/03/06 职场文书
化工生产实习心得体会
2016/01/22 职场文书