利用javascript实现 HTML 页面间传参数
单纯的html页面是无法实现跨页面传值的,必须依靠js来解决。下面的例子,从a页面输入001搜索,b页面显示搜索的结果:
a.html code
1 2 3 4 5 6 |
<form method="get" action="b.htm"> <input type="text" name="uid"> <br/><br/> <input type="submit" value="Search"> <br/> </form> |
b.html code
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 |
<head> <script type="text/javascript" > function Request(strName) { var strHref = window.document.location.href; var intPos = strHref.indexOf("?"); var strRight = strHref.substr(intPos + 1); var arrTmp = strRight.split("&"); for(var i = 0; i < arrTmp.length; i++) { var arrTemp = arrTmp[i].split("="); if(arrTemp[0].toUpperCase() == strName.toUpperCase()) return arrTemp[1]; } return ""; } </script> </head> <body> <table border="1" width="300"> <tr bgcolor="gray"> <td height="25">ID</td> <td>NAME</td> </tr> <tr id="div001" style="display: none;"> <td height="25">001</td> <td>Wang</td> </tr> <tr id="div002" style="display: none;"> <td height="25">002</td> <td>Zhang</td> </tr> </table> <script type="text/javascript" > var uidtemp = Request("uid"); if(uidtemp=="001") { document.getElementById("div001").style.display=""; } else { document.getElementById("div001").style.display="none"; } if(uidtemp=="002") { document.getElementById("div002").style.display=""; } else { document.getElementById("div002").style.display="none"; } </script> </body> |
**************************************************************************************
**************************************************************************************
index.htm?参数1=数值1&参数2=数值2&参数3=数据3&参数4=数值4&...... php程序员之家
静态html文件js读取url参数 根据获取html的参数值控制html页面输出
一、字符串分割分析法。
这里是一个获取URL带QUESTRING参数的JAVASCRIPT客户端解决方案,相当于asp的request.querystring,PHP的$_GET
函数:
<Script language="javascript">
function GetRequest() {
var url = location.search; //获取url中"?"符后的字串
var theRequest = new Object();
if (url.indexOf("?") != -1) {
var str = url.substr(1); phperz.com
strs = str.split("&");
for(var i = 0; i < strs.length; i ++) {
theRequest[strs[i].split("=")[0]]=unescape(strs[i].split("=")[1]);
}
}
return theRequest;
}
</Script>
然后我们通过调用此函数获取对应参数值:
<Script language="javascript">
var Request = new Object();
Request = GetRequest();
var 参数1,参数2,参数3,参数N;
参数1 = Request['参数1']; php程序员站
参数2 = Request['参数2'];
参数3 = Request['参数3'];
参数N = Request['参数N'];
</Script>
以此获取url串中所带的同名参数
二、正则分析法。
function GetQueryString(name)
{
var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)","i");
var r = window.location.search.substr(1).match(reg);
if (r!=null) return unescape(r[2]); return null;
}
alert(GetQueryString("参数名1"));
alert(GetQueryString("参数名2"));
alert(GetQueryString("参数名3"));
本文来自PHP程序员站,转载请注明出处: http://www.phperz.com/web-design/javascript/011QR46201218246.html