js實現頁面跳轉並傳值


一:跳轉到新頁面,並且是在新窗口中打開時:

function gogogo() 
{ 
//do someghing here... 
window.open("test2.html"); 
}

 

二:就在本頁面窗口中跳轉:

 

function totest2() 
{ 
window.location.assign( "test2.html"); 
}

 

如何在頁面跳轉的時候進行值的傳遞,當使用window.open()打開新頁面時,瀏覽器會認為這兩個窗口之間有一種打開與被打開的關系,所以在被打開的新窗口中在當前窗口的window對象中有一個window.opener 屬性,這個值里面放着打開窗口的引用,所以可以獲得這個值,進而引用上一頁面內的對象的值,示例如下:

<html> 
<head> 
<title>test1</title> 
<script type="text/javascript"> 
function totest2() 
{ 
window.open("test2.html"); 
} 
</script> 
</head> 
<body> 
<label id="label1" >page test1</label> 
<br><br> 
<input type="text" id="tx1"> 
<input type="button" id="bt2" value="to test2" onclick="totest2()"> 
</body> 
</html>

 

 

 
<html> 
<head> 
<title>test2</title> 
<script type="text/javascript"> 
function getvalue() 
{ 
var pare=window.opener; 
if(pare!=null) 
{ 
var what=pare.document.getElementById("tx1"); 
if(what!=null) 
{ 
alert(what.value); 
} 
} 
} 
</script> 
</head> 
<body> 
<label id="label1" >page test2</label> 
<br><br> 
<input type="button" onclick="getvalue()" value="get test1 page value"> 
</body> 
</html> 

這兩個頁面,可以從后一個頁面中獲得前一個頁面中的值,但是我感覺好像不大實用。。。。。。
優點:取值方便.只要window.opener指向父窗口,就可以訪問所有對象.
不僅可以訪問值,還可以訪問父窗口的方法.值長度無限制.
缺點:兩窗口要存在着關系.就是利用window.open打開的窗口.不能跨域. 

下面看看另一種方法,使用URL附加字段在頁面跳轉間傳值,前面用XMLHttpRequest時,用到過這種方式。簡單原始的示例如下: 

 
<html> 
<head> 
<title>test3</title> 
<script type="text/javascript"> 
function totest2() 
{ 
var parm1=document.getElementById("tx1").value; 
var parm2=document.getElementById("tx2").value; 
var myurl="test4.html"+"?"+"parm1="+parm1+"&parm2="+parm2; 
window.location.assign(myurl); 
} 
</script> 
</head> 
<body> 
<label id="label1" >page test3</label> 
<br><br> 
<input type="text" id="tx1"> 
<input type="text" id="tx2"> 
<input type="button" id="bt2" value="to test2" onclick="totest2()"> 
</body> 
</html> 
 
<html> 
<head> 
<title>test1</title> 
<script type="text/javascript"> 
function getparm1() 
{ 
var url=location.href; 
var tmp1=url.split("?")[1]; 
var tmp2=tmp1.split("&")[0]; 
var tmp3=tmp2.split("=")[1]; 
var parm1=tmp3; 
alert(parm1); 
} 
function getparm2() 
{ 
var url=location.href; 
var tmp1=url.split("?")[1]; 
var tmp2=tmp1.split("&")[1]; 
var tmp3=tmp2.split("=")[1]; 
var parm2=tmp3; 
alert(parm2); 
} 
</script> 
</head> 
<body> 
<label id="label1" >page test4</label> 
<br><br> 
<input type="button" id="bt1" value="get parm1" onclick="getparm1()"> 
<br><br> 
<input type="button" id="bt2" value="get parm1" onclick="getparm2()"> 
</body> 
</html> 

最后一種頁面間傳值的方法就是COOKIE共享,這個比較容易理解,由一個頁面在客戶端機器放置一個COOKIE文件,下一個頁面訪問的時候,直接讀取這里面的值就OK了。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM