当前位置: 首页 > 图文教程 > 网络编程 > Javascript > JS 参数传递的实际应用代码分析

Javascript
QQ邮箱的一个文本编辑器代码
Z-Blog中用到的js代码
绝对经典的滑轮新闻显示(javascript+css)实现
用js实现的仿sohu博客更换页面风格(简单版)
仿Vista进程条效果
用Javascript判断图片是否存在,不存在则显示默认图片的代码
用JQuery 实现的自定义对话框
jQuery使用手册之三 CSS操作
利用Dojo和JSON建立无限级AJAX动态加载的功能模块树
贴图转换+转贴工具用到的js代码超级推荐
超级简单的图片防盗(HTML),好用
现代 javscript 编程 资料
超级可爱纯js网页时钟
Dojo之路:如何利用Dojo实现Drag and Drop效果
AJAX架构之Dojo篇
发两个小东西,ASP/PHP 学习工具。 用JavaScript写的
使用prototype.js 的时候应该特别注意的几个问题.
一个已封装好的漂亮进度条
漂亮的widgets,支持换肤和后期开发新皮肤
用javascript实现的仿Flash广告图片轮换效果

Javascript 中的 JS 参数传递的实际应用代码分析


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-10   浏览: 277 ::
收藏到网摘: n/a

在项目中,有一个Ajax加载的区域,是一个Div标签,id为msg_box,这个控制链接包含在一个左侧的导航中,当从其他页面链接到这个页面时,该JS代码就失效了。 原因很简单,在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>