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