Javascript獲取HTML靜態(tài)頁(yè)面參數(shù)傳遞值示例
更新時(shí)間:2013年08月18日 11:16:42 作者:
獲取HTML靜態(tài)頁(yè)面參數(shù)傳遞值可以利用split函數(shù)來(lái)按參數(shù)切成數(shù)組、利用正則表達(dá)式來(lái)獲取,具體實(shí)現(xiàn)如下,感興趣的朋友可以參考下
給大家看一下我的代碼 只要把這些代碼嵌入到頁(yè)面文件即可
例一
利用正則表達(dá)式來(lái)獲取
var LocString = String(window.document.location.href);
function getQueryStr(str) {
var rs = new RegExp("(^|)" + str + "=([^&]*)(&|$)", "gi").exec(LocString), tmp;
if (tmp = rs) {
return tmp[2];
}
// parameter cannot be found
return "";
}
調(diào)用方法
document.getElementById("user").value = getQueryStr("user");
document.getElementById("password").value = getQueryStr("password");
document.getElementById("sysno").value = getQueryStr("sysno");
例二
利用split函數(shù)來(lái)按參數(shù)切成數(shù)組
<script>
urlinfo=window.location.href; //獲取當(dāng)前頁(yè)面的url
len=urlinfo.length;//獲取url的長(zhǎng)度
offset=urlinfo.indexOf("?");//設(shè)置參數(shù)字符串開(kāi)始的位置
newsidinfo=urlinfo.substr(offset,len)//取出參數(shù)字符串 這里會(huì)獲得類似“id=1”這樣的字符串
newsids=newsidinfo.split("=");//對(duì)獲得的參數(shù)字符串按照“=”進(jìn)行分割
newsid=newsids[1];//得到參數(shù)值
alert("您要傳遞的參數(shù)值是"+newsid);
</script>
不過(guò)一定要記得 這個(gè)方法只是針對(duì)含有參數(shù)的url有用 ,如果對(duì)方用了POST方法傳遞參數(shù), url中是不會(huì)含有參數(shù)的所以這個(gè)技巧只對(duì)GET方法或者指定了參數(shù)的url有用哦
下面看一個(gè)完整的實(shí)例
aa.htm是參數(shù)輸滲入滲出界面
bb.htm是參數(shù)接收處理界面
aa.htm
<html>
<head>
</head>
<body>
<script>
function submit()
{
var input1 = document.getElementById("inputid");
window.open("bb.htm?inputStr=" + input1.value);//傳入?yún)?shù)
}
</script>
<input type = "text" id = "inputid">
<input type = "button" onclick = "submit()" value = "提交">
</body>
</html>
bb.htm:
<html>
<head>
<script>
//獲得參數(shù)的方法
var request =
{
QueryString : function(val)
{
var uri = window.location.search;
var re = new RegExp("" +val+ "=([^&?]*)", "ig");
return ((uri.match(re))?(uri.match(re)[0].substr(val.leng th+1)):null);
}
}
</script>
</head>
<body>
<script>
//調(diào)用方法獲得參數(shù)
var rt = request.QueryString("inputStr");
alert(rt);
</script>
</body>
</html>
bb.htm
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<SCRIPT LANGUAGE="JavaScript">
<!--
var request = {
QueryString : function(val) {
var uri = window.location.search;
var re = new RegExp("" +val+ "=([^&?]*)", "ig");
return ((uri.match(re))?(uri.match(re)[0].substr(val.leng th+1)):null);
}
}
var a = request.QueryString ("a");
var b = request.QueryString ("b");
var c = request.QueryString ("c");
if ((a != null)){a=a} else{a="參數(shù)A空"}
if ((b != null)){b=b} else{b="參數(shù)B空"}
if ((c != null)){c=c} else{c="參數(shù)C空"}
document.writeln("參數(shù)A: " + a);
document.writeln("<br>參數(shù)B: " + b);
document.writeln("<br>參數(shù)C: " + c);
//-->
</SCRIPT>
</head>
<body>
<form name="form1" action="?">
請(qǐng)輸入?yún)?shù)值:<br>
<SCRIPT LANGUAGE="JavaScript">
document.writeln("A:<input type='text' name='a' value='"+a+"'><br>");
document.writeln("B:<input type='text' name='b' value='"+b+"'><br>");
document.writeln("C:<input type='text' name='c' value='"+c+"'><br>");
</SCRIPT>
<input type="submit" name="Submit" value="提交參數(shù)查觀效果">
</form>
</body>
</html>
例一
利用正則表達(dá)式來(lái)獲取
復(fù)制代碼 代碼如下:
var LocString = String(window.document.location.href);
function getQueryStr(str) {
var rs = new RegExp("(^|)" + str + "=([^&]*)(&|$)", "gi").exec(LocString), tmp;
if (tmp = rs) {
return tmp[2];
}
// parameter cannot be found
return "";
}
調(diào)用方法
復(fù)制代碼 代碼如下:
document.getElementById("user").value = getQueryStr("user");
document.getElementById("password").value = getQueryStr("password");
document.getElementById("sysno").value = getQueryStr("sysno");
例二
利用split函數(shù)來(lái)按參數(shù)切成數(shù)組
復(fù)制代碼 代碼如下:
<script>
urlinfo=window.location.href; //獲取當(dāng)前頁(yè)面的url
len=urlinfo.length;//獲取url的長(zhǎng)度
offset=urlinfo.indexOf("?");//設(shè)置參數(shù)字符串開(kāi)始的位置
newsidinfo=urlinfo.substr(offset,len)//取出參數(shù)字符串 這里會(huì)獲得類似“id=1”這樣的字符串
newsids=newsidinfo.split("=");//對(duì)獲得的參數(shù)字符串按照“=”進(jìn)行分割
newsid=newsids[1];//得到參數(shù)值
alert("您要傳遞的參數(shù)值是"+newsid);
</script>
不過(guò)一定要記得 這個(gè)方法只是針對(duì)含有參數(shù)的url有用 ,如果對(duì)方用了POST方法傳遞參數(shù), url中是不會(huì)含有參數(shù)的所以這個(gè)技巧只對(duì)GET方法或者指定了參數(shù)的url有用哦
下面看一個(gè)完整的實(shí)例
aa.htm是參數(shù)輸滲入滲出界面
bb.htm是參數(shù)接收處理界面
aa.htm
復(fù)制代碼 代碼如下:
<html>
<head>
</head>
<body>
<script>
function submit()
{
var input1 = document.getElementById("inputid");
window.open("bb.htm?inputStr=" + input1.value);//傳入?yún)?shù)
}
</script>
<input type = "text" id = "inputid">
<input type = "button" onclick = "submit()" value = "提交">
</body>
</html>
bb.htm:
<html>
<head>
<script>
//獲得參數(shù)的方法
var request =
{
QueryString : function(val)
{
var uri = window.location.search;
var re = new RegExp("" +val+ "=([^&?]*)", "ig");
return ((uri.match(re))?(uri.match(re)[0].substr(val.leng th+1)):null);
}
}
</script>
</head>
<body>
<script>
//調(diào)用方法獲得參數(shù)
var rt = request.QueryString("inputStr");
alert(rt);
</script>
</body>
</html>
bb.htm
復(fù)制代碼 代碼如下:
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<SCRIPT LANGUAGE="JavaScript">
<!--
var request = {
QueryString : function(val) {
var uri = window.location.search;
var re = new RegExp("" +val+ "=([^&?]*)", "ig");
return ((uri.match(re))?(uri.match(re)[0].substr(val.leng th+1)):null);
}
}
var a = request.QueryString ("a");
var b = request.QueryString ("b");
var c = request.QueryString ("c");
if ((a != null)){a=a} else{a="參數(shù)A空"}
if ((b != null)){b=b} else{b="參數(shù)B空"}
if ((c != null)){c=c} else{c="參數(shù)C空"}
document.writeln("參數(shù)A: " + a);
document.writeln("<br>參數(shù)B: " + b);
document.writeln("<br>參數(shù)C: " + c);
//-->
</SCRIPT>
</head>
<body>
<form name="form1" action="?">
請(qǐng)輸入?yún)?shù)值:<br>
<SCRIPT LANGUAGE="JavaScript">
document.writeln("A:<input type='text' name='a' value='"+a+"'><br>");
document.writeln("B:<input type='text' name='b' value='"+b+"'><br>");
document.writeln("C:<input type='text' name='c' value='"+c+"'><br>");
</SCRIPT>
<input type="submit" name="Submit" value="提交參數(shù)查觀效果">
</form>
</body>
</html>
您可能感興趣的文章:
- js setTimeout 參數(shù)傳遞使用介紹
- JavaScript Base64編碼和解碼,實(shí)現(xiàn)URL參數(shù)傳遞。
- JS的參數(shù)傳遞示例介紹
- 四種參數(shù)傳遞的形式——URL,超鏈接,js,form表單
- Js從頭學(xué)起(基本數(shù)據(jù)類型和引用類型的參數(shù)傳遞詳細(xì)分析)
- JavaScript函數(shù)的調(diào)用以及參數(shù)傳遞
- javascript自定義函數(shù)參數(shù)傳遞為字符串格式
- javascript實(shí)現(xiàn)html頁(yè)面之間參數(shù)傳遞的四種方法實(shí)例分析
- JS 參數(shù)傳遞的實(shí)際應(yīng)用代碼分析
- JavaScript函數(shù)參數(shù)的傳遞方式詳解
相關(guān)文章
javascript顯示系統(tǒng)當(dāng)前時(shí)間代碼
這篇文章主要為大家詳細(xì)介紹了javascript如何顯示系統(tǒng)當(dāng)前時(shí)間代碼,具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2016-12-12JS自定義滾動(dòng)條效果簡(jiǎn)單實(shí)現(xiàn)代碼
這篇文章主要為大家詳細(xì)介紹了JS自定義滾動(dòng)條效果的簡(jiǎn)單實(shí)現(xiàn)代碼,文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2017-07-07ES6的函數(shù)rest參數(shù)使用小結(jié)
這篇文章主要介紹了ES6的函數(shù)rest參數(shù)用法,通過(guò)一個(gè)rest參數(shù)代替arguments變量的例子,對(duì)ES6?rest參數(shù)用法講解的非常詳細(xì),需要的朋友可以參考下2023-08-08