参数字传送递的莫过于行使代码解析
分类:计算机网络

本文实例讲述了javascript实现html页面之间参数传递的四种方法。分享给大家供大家参考,具体如下:

原因很简单,在DOM中没有id为msg_box的div标签,该怎么解决这个问题呢?
方案:
在所有页面公用的头部文件header.tpl.html中写入:

我们知道,在服务器端asp,jsp等程序可以接受html页面上的form传来的参数。那么,可不可以传递参数给html页面呢。可以。
原理:通过window.location.href中的分割符获得各个参数

复制代码 代码如下:

方法一:

<script>
function changMenu(index){
if(typeof getElementById("msg_box") == "object"){
//如果存在msg_box对象 则刷新该页的对象
showMenu(index);
}else{
//如果不存在 则重定向到使用Ajax刷新的页面
window.location = "/index.html";
}
}
</script>

/*
 *函数功能:从href获得参数
 *sHref: http://www.cscenter.com.cn/arg.htm?arg1=d&arg2=re
 *sArgName:arg1, arg2
 *return: the value of arg. d, re
 */
function GetArgsFromHref(sHref, sArgName)
{
 var args = sHref.split("?");
 var retval = "";
 if(args[0] == sHref) /*参数为空*/
 {
   return retval; /*无需做任何处理*/
 } 
 var str = args[1];
 args = str.split("&");
 for(var i = 0; i < args.length; i ++)
 {
  str = args[i];
  var arg = str.split("=");
  if(arg.length <= 1) continue;
  if(arg[0] == sArgName) retval = arg[1];
 }
 return retval;
}

但是该项目index.html存在四个相同性质的页面,都需要Ajax来刷新,这样就存在一个问题,当用户点击第三个栏目时,虽然可以回到index.html,但是无法刷新内容到第三个栏目。这时有两种解决方案:
方案1:
第一步:
在所有页面公用的头部文件header.tpl.html中写入:

方法二:

复制代码 代码如下:

function getvalue(name)
{
var str=window.location.search;
if (str.indexOf(name)!=-1)
{
var pos_start=str.indexOf(name)+name.length+1;
var pos_end=str.indexOf("&",pos_start);
if (pos_end==-1)
{
return str.substring(pos_start);
}
else
{
return str.substring(pos_start,pos_end)
}
}
else
{
return "没有这个name值";
}
}
alert(getvalue(name));

<script>
function changMenu(index){
if(typeof getElementById("msg_box") == "object"){
//如果存在msg_box对象 则刷新该页的对象
showMenu(index);
}else{
//如果不存在 则重定向到使用Ajax刷新的页面
window.location = "/index.html?type="+index;
}
}
</script>

方法三:

第二步:
改进showMenu函数

Request = {
QueryString : function(item){
var svalue = location.search.match(new RegExp("[?&]" + item + "=([^&]*)(&?)","i"));
return svalue ? svalue[1] : svalue;
}
}
alert(Request.QueryString("id"));

复制代码 代码如下:

方法四:

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);
......
}
}
}

var url=location.search;
var Request = new Object();
if(url.indexOf("?")!=-1)
{
 var str = url.substr(1); //去掉?号
 strs = str.toLowerCase();
 strs = strs.split("&");
 for(var i=0;i<strs.length;i++)
 {
  Request[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
 }
}
var mapWidth = Request["w"];
var mapHeight = Request["h"];

方案2:
调用JS的cookie功能传递参数
在所有页面公用的头部文件header.tpl.html中写入:

希望本文所述对大家JavaScript程序设计有所帮助。

复制代码 代码如下:

您可能感兴趣的文章:

  • js setTimeout 参数传递使用介绍
  • Javascript获取HTML静态页面参数传递值示例
  • JavaScript Base64编码和解码,实现URL参数传递。
  • JS的参数传递示例介绍
  • 四种参数传递的形式——URL,超链接,js,form表单
  • Js从头学起(基本数据类型和引用类型的参数传递详细分析)
  • JavaScript函数的调用以及参数传递
  • javascript自定义函数参数传递为字符串格式
  • JS 参数传递的实际应用代码分析
  • JavaScript函数参数的传递方式详解

<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>

您可能感兴趣的文章:

  • js setTimeout 参数传递使用介绍
  • Javascript获取HTML静态页面参数传递值示例
  • JavaScript Base64编码和解码,实现URL参数传递。
  • JS的参数传递示例介绍
  • 四种参数传递的形式——URL,超链接,js,form表单
  • Js从头学起(基本数据类型和引用类型的参数传递详细分析)
  • JavaScript函数的调用以及参数传递
  • javascript自定义函数参数传递为字符串格式
  • javascript实现html页面之间参数传递的四种方法实例分析
  • JavaScript函数参数的传递方式详解

本文由正版必中一肖图发布于计算机网络,转载请注明出处:参数字传送递的莫过于行使代码解析

上一篇:没有了 下一篇:JavaScript得到当前cpu使用率的主意,什么时候被调
猜你喜欢
热门排行
精彩图文