javascript靜態頁面間的傳值和接收

一:JavaScript靜態頁面值傳遞之URL篇

能過URL進行傳值.把要傳遞的信息接在URL上.

例子:

參數傳出頁面Post.htm—>

 

<input type="text" name="username">

<input type="text" name="sex">

<input type="button" value="Post">

<script language="javascript" >

function Post()

{

  //單個值 Read.htm?username=baobao;

  //多全值 Read.htm?username=baobao&sex=male;

  url = "Read.htm?username="+escape(document.all.username.value);

  url += "&sex=" + escape(document.all.sex.value);

  location.href=url;

}

</script>

 

參數接收頁面Read.htm—>

 

<script language="javascript" >

/*

*--------------- Read.htm -----------------

* Request[key]

* 功能:實現ASP的取得URL字符串,Request("AAA")

* 參數:key,字符串.

* 實例:alert(Request["AAA"])

*--------------- Request.htm -----------------

*/

var url=location.search;

var Request = new Object();

if(url.indexOf("?")!=-1)

{

  var str = url.substr(1) //去掉?號

  strs = str.split("&");

  for(var i=0;i<strs.length;i++)

  {

     Request[strs[i ].split("=")[0]]=unescape(strs[ i].split("=")[1]);

  }

}

alert(Request["username"])

alert(Request["sex"])

</script><script language="JavaScript">

<!--

function Request(strName)

{

var strHref = "www.abc.com/index.htm?a=1&b=1&c=測試測試";

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 "";

}

alert(Request("a"));

alert(Request("b"));

alert(Request("c"));

//-->

</script>

<script>

String.prototype.getQuery = function(name)

{

  var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");

  var r = this.substr(this.indexOf("?")+1).match(reg);

  if (r!=null) return unescape(r[2]); return null;

}

var str ="www.abc.com/index.htm?a=1&b=1&c=測試測試";

alert(str.getQuery("a"));

alert(str.getQuery("b"));

alert(str.getQuery("c"));

</script>

 

優點:取值方便.可以跨域.
缺點:值長度有限制

 

二:JavaScript靜態頁面值傳遞之Cookie篇

Cookie是瀏覽器存儲少量命名數據.

它與某個特定的網頁或網站關聯在一起.

Cookie用來給瀏覽器提供內存,

以便腳本和服務器程序可以在一個頁面中使用另一個頁面的輸入數據.

 

 

參數傳出頁面Post.htm—>

 

<input type="text" name="txt1">

<input type="button" value="Post">

<script language="javascript" >

function setCookie(name,value)

{

/*

*--------------- setCookie(name,value) -----------------

* setCookie(name,value)

* 功能:設置得變量name的值

* 參數:name,字符串;value,字符串.

* 實例:setCookie('username','baobao')

*--------------- setCookie(name,value) -----------------

*/

  var Days = 30; //此 cookie 將被保存 30 天

  var exp = new Date();

  exp.setTime(exp.getTime() + Days*24*60*60*1000);

  document.cookie = name + "="+ escape (value) + ";expires=" + exp.toGMTString();

  location.href = "Read.htm"; //接收頁面.

}

</script>

 

參數接收頁面Read.htm—>

 

<script language="javascript" >

function getCookie(name)

{

/*

*--------------- getCookie(name) -----------------

* getCookie(name)

* 功能:取得變量name的值

* 參數:name,字符串.

* 實例:alert(getCookie("baobao"));

*--------------- getCookie(name) -----------------

*/

  var arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"));

  if(arr !=null) return unescape(arr[2]); return null;

}

alert(getCookie("baobao"));

</script>

 

優點:可以在同源內的任意網頁內訪問.生命期可以設置.
缺點:值長度有限制.

三:JavaScript靜態頁面值傳遞之Window.open篇

這兩窗口之間存在着關係.父窗口parent.htm打開子窗口son.htm

子窗口可以通過window.opener指向父窗口.這樣可以訪問父窗口的對象.

 

 

<input type=text name=maintext>

<input type=button value="Open">

Read.htm

<script language="javascript" >

//window.open打開的窗口.

//利用opener指向父窗口.

var parentText = window.opener.document.all.maintext.value;

alert(parentText);

</script>

 

優點:取值方便.只要window.opener指向父窗口,就可以訪問所有對象.不僅可以訪問值,還可以訪問父窗口的方法.值長度無限制.
缺點:兩窗口要存在着關係.就是利用window.open打開的窗口.不能跨域.


發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章