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 相关文章推荐
ToolTips JQEURY插件之简洁小提示框效果
Nov 19 Javascript
jqTransform form表单美化插件使用方法
Jul 05 Javascript
JQuery写动态树示例代码
Jul 31 Javascript
jquery 淡入淡出效果的简单实现
Feb 07 Javascript
javascript自定义右键弹出菜单实现方法
May 25 Javascript
js 弹出对话框(遮罩)透明,可拖动的简单实例
Jul 11 Javascript
5分钟打造简易高效的webpack常用配置
Jul 04 Javascript
jQuery实现注册会员时密码强度提示信息功能示例
Sep 05 jQuery
对vux点击事件的优化详解
Aug 28 Javascript
vue踩坑记-在项目中安装依赖模块npm install报错
Apr 02 Javascript
关于vue-cli 3配置打包优化要点(推荐)
Apr 22 Javascript
vue print.js打印支持Echarts图表操作
Nov 13 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
在PHP3中实现SESSION的功能(一)
2006/10/09 PHP
PHP中通过ADO调用Access数据库的方法测试不通过
2006/12/31 PHP
php实现根据url自动生成缩略图的方法
2014/09/23 PHP
php实现压缩多个CSS与JS文件的方法
2014/11/11 PHP
php从文件夹随机读取文件的方法
2015/06/01 PHP
WordPres对前端页面调试时的两个PHP函数使用小技巧
2015/12/22 PHP
JQuery最佳实践之精妙的自定义事件
2010/08/11 Javascript
jquery实现简单的拖拽效果实例兼容所有主流浏览器
2013/06/21 Javascript
浅谈JavaScript字符串与数组
2015/06/03 Javascript
jquery实现最简单的滑动菜单效果代码
2015/09/12 Javascript
再谈JavaScript异步编程
2016/01/27 Javascript
JS密码生成与强度检测完整实例(附demo源码下载)
2016/04/06 Javascript
深入理解Javascript箭头函数中的this
2017/02/13 Javascript
vue3中轻松实现switch功能组件的全过程
2021/01/07 Vue.js
[42:20]Secret vs Liquid 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
Python新手实现2048小游戏
2015/03/31 Python
Python聚类算法之DBSACN实例分析
2015/11/20 Python
教你用Type Hint提高Python程序开发效率
2016/08/08 Python
python getopt详解及简单实例
2016/12/30 Python
Python实现App自动签到领取积分功能
2018/09/29 Python
python数据预处理之数据标准化的几种处理方式
2019/07/17 Python
Python在Matplotlib图中显示中文字体的操作方法
2019/07/29 Python
如何基于Python实现电子邮件的发送
2019/12/16 Python
宝塔面板成功部署Django项目流程(图文)
2020/06/22 Python
面向新手解析python Beautiful Soup基本用法
2020/07/11 Python
python3 中时间戳、时间、日期的转换和加减操作
2020/07/14 Python
利用Python实现最小二乘法与梯度下降算法
2021/02/21 Python
CSS3的first-child选择器实战攻略
2016/04/28 HTML / CSS
Bootstrap 学习分享
2012/11/12 HTML / CSS
解决html5中的video标签ios系统中无法播放使用的问题
2020/08/10 HTML / CSS
Manuka Doctor美国官网:麦卢卡蜂蜜和蜂毒护肤
2016/12/25 全球购物
拓展培训心得体会
2014/01/04 职场文书
领导干部“四风”问题批评与自我批评材料
2014/09/24 职场文书
高中政治教学反思
2016/02/23 职场文书
python图像处理 PIL Image操作实例
2022/04/09 Python
Python中np.random.randint()参数详解及用法实例
2022/09/23 Python