Javascript獲取HTML靜態(tài)頁面參數(shù)傳遞值示例
更新時間:2013年08月18日 11:16:42 作者:
獲取HTML靜態(tài)頁面參數(shù)傳遞值可以利用split函數(shù)來按參數(shù)切成數(shù)組、利用正則表達式來獲取,具體實現(xiàn)如下,感興趣的朋友可以參考下
給大家看一下我的代碼 只要把這些代碼嵌入到頁面文件即可
例一
利用正則表達式來獲取
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ù)來按參數(shù)切成數(shù)組
<script>
urlinfo=window.location.href; //獲取當前頁面的url
len=urlinfo.length;//獲取url的長度
offset=urlinfo.indexOf("?");//設(shè)置參數(shù)字符串開始的位置
newsidinfo=urlinfo.substr(offset,len)//取出參數(shù)字符串 這里會獲得類似“id=1”這樣的字符串
newsids=newsidinfo.split("=");//對獲得的參數(shù)字符串按照“=”進行分割
newsid=newsids[1];//得到參數(shù)值
alert("您要傳遞的參數(shù)值是"+newsid);
</script>
不過一定要記得 這個方法只是針對含有參數(shù)的url有用 ,如果對方用了POST方法傳遞參數(shù), url中是不會含有參數(shù)的所以這個技巧只對GET方法或者指定了參數(shù)的url有用哦
下面看一個完整的實例
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="?">
請輸入?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>
例一
利用正則表達式來獲取
復(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ù)來按參數(shù)切成數(shù)組
復(fù)制代碼 代碼如下:
<script>
urlinfo=window.location.href; //獲取當前頁面的url
len=urlinfo.length;//獲取url的長度
offset=urlinfo.indexOf("?");//設(shè)置參數(shù)字符串開始的位置
newsidinfo=urlinfo.substr(offset,len)//取出參數(shù)字符串 這里會獲得類似“id=1”這樣的字符串
newsids=newsidinfo.split("=");//對獲得的參數(shù)字符串按照“=”進行分割
newsid=newsids[1];//得到參數(shù)值
alert("您要傳遞的參數(shù)值是"+newsid);
</script>
不過一定要記得 這個方法只是針對含有參數(shù)的url有用 ,如果對方用了POST方法傳遞參數(shù), url中是不會含有參數(shù)的所以這個技巧只對GET方法或者指定了參數(shù)的url有用哦
下面看一個完整的實例
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="?">
請輸入?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編碼和解碼,實現(xiàn)URL參數(shù)傳遞。
- JS的參數(shù)傳遞示例介紹
- 四種參數(shù)傳遞的形式——URL,超鏈接,js,form表單
- Js從頭學(xué)起(基本數(shù)據(jù)類型和引用類型的參數(shù)傳遞詳細分析)
- JavaScript函數(shù)的調(diào)用以及參數(shù)傳遞
- javascript自定義函數(shù)參數(shù)傳遞為字符串格式
- javascript實現(xiàn)html頁面之間參數(shù)傳遞的四種方法實例分析
- JS 參數(shù)傳遞的實際應(yīng)用代碼分析
- JavaScript函數(shù)參數(shù)的傳遞方式詳解
相關(guān)文章
ES6的函數(shù)rest參數(shù)使用小結(jié)
這篇文章主要介紹了ES6的函數(shù)rest參數(shù)用法,通過一個rest參數(shù)代替arguments變量的例子,對ES6?rest參數(shù)用法講解的非常詳細,需要的朋友可以參考下2023-08-08