http://www.cnblogs.com/sunnycoder/archive/2010/02/28/1674998.html
从网上看到一些使用js获取QueryString的方法，但用起来不是很理想，所以决定自己写一个。主要原理是使用正则表达式匹配location.search中的字符串。
三个主要方法：
| 说明 |
|
| getQueryString |
获取QueryString的数组。 例如路径QueryStringDemo.html?id=5&type=1&flag=0 调用后返回["id=5","type=1","flag=0"] |
| getQueryStringByName |
|
| getQueryStringByIndex |
根据QueryString参数索引获取值 |
| @H_301_64@//@H_301_64@获取QueryString@H_301_64@的数组 functiongetQueryString(){ varresult = location.search.match(newRegExp("[\?\&][^\?\&]+=[^\?\&]+","g")); if(result ==null){ return""; } for(vari = 0; i < result.length; i++){ result[i] = result[i].substring(1); } returnresult; } @H_301_64@//@H_301_64@根据QueryString@H_301_64@参数名称获取值 functiongetQueryStringByName(name){ varresult = location.search.match(newRegExp("[\?\&]"+ name+"=([^\&]+)",21)">"i")); if(result ==null|| result.length < 1){ return""; } returnresult[1]; } @H_301_64@//@H_301_64@根据QueryString@H_301_64@参数索引获取值 functiongetQueryStringByIndex(index){ if(index ==null){ return""; } varqueryStringList = getQueryString(); if(index >= queryStringList.length){ return""; } varresult = queryStringList[index]; varstartIndex = result.indexOf("=") + 1; result = result.substring(startIndex); returnresult; } |
测试页面路径：QueryStringDemo.html?id=5&type=1&flag=0
页面加载时：
在QueryString's name后的文本框中输入要获取的QueryString的名称获取相应的值：
在QueryString's index后的文本框中输入要获取的QueryString的索引获取相应的值（索引从0开始）：
这样就可以在页面中方便的获取QueryString的值了。最后附上测试页面QueryStringDemo.html的源代码：
| <!DOCTYPEhtmlPUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml">
<head> <Metacontent="text/html; charset=utf-8"http-equiv="Content-Type"/> <title>QueryString获取</title> @H_301_64@<!--script type="text/javascript" src="CommonFiles/sunnycoder.js"></script--> <scripttype="text/javascript"> @H_301_64@//@H_301_64@获取QueryString@H_301_64@的数组 functiongetQueryString(){ varresult = location.search.match(newRegExp("g")); for(vari = 0; i < result.length; i++){ result[i] = result[i].substring(1); } returnresult; } @H_301_64@//@H_301_64@根据QueryString@H_301_64@参数名称获取值 functiongetQueryStringByName(name){ varresult = location.search.match(newRegExp("=") + 1; result = result.substring(startIndex); returnresult; } @H_301_64@//@H_301_64@绑定当控件高亮选中时，点击@H_301_64@“@H_301_64@回车键@H_301_64@”@H_301_64@时执行的操作 @H_301_64@//control@H_301_64@：要绑定事件的控件 @H_301_64@//func@H_301_64@：要执行的方法 functionbindEnterEvent(control,func){ control.onkeypress =function(){ if(event.keyCode == 13){ func(); } } } @H_301_64@//@H_301_64@根据输入的QueryString@H_301_64@名称获取值 functiongetByName(){ varname = document.getElementById("txtQueryStringName").value; document.getElementById("txtResult").innerHTML = getQueryStringByName(name); } @H_301_64@//@H_301_64@根据输入的QueryString@H_301_64@的索引获取值 functiongetByIndex(){ varindex = document.getElementById("txtQueryStringIndex").value; document.getElementById("txtResult").innerHTML = getQueryStringByIndex(index); } </script> </head>
<body>
<div> <span>QueryString :</span><spanid="queryString"></span> </span>QueryString's name : </span> <inputid="txtQueryStringName"name="txtQueryStringName"type="text"/> <inputname="btnGetByName"type="button"value="获取"onclick="getByName()"/> </span>QueryString's index :</inputid="txtQueryStringIndex"name="txtQueryStringIndex"type="text"/> <inputname="btnGetByIndex"type="button"value="获取"onclick="getByIndex()"/>
</span>结果 ：</spanid="txtResult"></div> @H_301_64@<!--@H_301_64@页面加载时执行的操作--> <scripttype="text/javascript"> @H_301_64@//@H_301_64@显示所有QueryString document.getElementById("queryString").innerHTML = getQueryString(); @H_301_64@//@H_301_64@为txtQueryStringName@H_301_64@绑定回车事件 bindEnterEvent(txtQueryStringName,getByName); @H_301_64@//@H_301_64@为txtQueryStringIndex@H_301_64@绑定回车事件 bindEnterEvent(txtQueryStringIndex,getByIndex); </body>
</html> |
