利用JavaScript实现静态html页面参数传递
昨天别人问的一个问题，静态html的参数传递。以前接触过，不过没有仔细的看过。今天专门看了一下，原理很简单，就是javascript根据url分析出参数的值，只不过在php中是经过系统封装的，可以直接用，静态页面中需要自己提取罢了。
实现的方法主要有两个：一是正则提取（RegExp），二是字符串切割（split）。
实例如下：
假设test1.html向test2.html传值，形如http://test.com/test1.html?keyword=value，test2.html页面接受并输出这个值。
test1.html代码：
<html>
<head>
<title> TEST1 </title>
</head>
<body>
<script type="text/javascript">
function submit()
{
var input1= document.getElementById("inputid");
window.open("test2.html?keyword=" + input1.value);//传入参数
}
</script>
<input type="text" id="inputid">
<input type="button" onclick="submit()" value="提交">
</body>
</html>
test2.html代码：
A:正则取值方式的
<html>
<head>
<title> TEST 2</title>
<script type="text/javascript">
//获得参数的方法
var request =
{
QueryString : function(val)
{
var uri = window.location.search;
var url = window.location.href;
var re = new RegExp("" +val+ "=([^&?]*)", "ig");
return ((uri.match(re))?(uri.match(re)[0].substr(val.length+1)):null);
}
}
</script>
</head>
<body>
<script type="text/javascript">
//调用方法获得参数
var rt = request.QueryString("keyword");
document.write(rt);
</script>
</body>
</html>
B分割方式取值的：
<html>
<head>
<title>TEST2</title>
</head>
<body>
<script type="text/javascript">
function getparastr(strname)
{
var hrefstr,pos,parastr,para,tempstr;
hrefstr = window.location.href;
pos = hrefstr.indexOf("?")
parastr = hrefstr.substring(pos+1);
para = parastr.split("&");
tempstr="";
for(i=0;i<para.length;i++)
{
tempstr = para[i];
pos = tempstr.indexOf("=");
if(tempstr.substring(0,pos) == strname)
{
return tempstr.substring(pos+1);
}
}
return null;
}
// 获取tr参数
var tr = getparastr("keyword");
document.write(tr);
</script>
</body>
</html>
滴答声声博客
0个评论
莫非?这就是传说中的沙发...有木有!