js跳轉頁面方法實現匯總

一、頁面之間的跳轉傳參

1、在頁面之間跳轉的方式有兩種：

window.location.href=”test.html?num=10”   地址會改變參數也會被傳遞但是不會打開新窗口

window.open("test.html") 這樣會重新打開一個新窗口。

2、獲取參數

如果是按照第一種方式進行了傳遞則有參數，那么我們怎們獲取url中的參數那，那就使用js默認的屬性：  var url = location.search; 

其中的location.search 就是js自動獲取url中？ 后的所有值。獲取了這個之后就可以使用substring，split等來獲取參數了。

3、實例展示

 

        // 跳轉url 以及傳遞的參數
    window.location.href='http://img.as.com/news/image/newscenter/20111107zt/whd/30share/jieguo1n.html?money='+nums+'&url='+fxurl;

        // 獲取money，以及分型的地址
    function GetRequest() {
          var url = location.search;
         var theRequest = new Object();
          if (url.indexOf("?") != -1) {
            var str = url.substr(1);
            //alert(str);
            var strs= new Array();
             strs = str.split('&');
            var money=strs[0].substring(6);
            fxurl=(strs[1].substring(4)).trim();
            //alert(fxurl);
            var  view=money+"元";
            $("#jieguo1m").html(view);
      }
}
GetRequest();

這樣當跳轉到url指定的頁面后，調用GetRequest();這個函數，函數中的location.search;來獲取了url中？后的所有參數，接下來就是按照需求來解析了。

 

二、返回上一頁

1、在原來的窗體中直接跳轉用

window.location.href="test.html";

2、返回上一頁原頁面中的表單中的數據會丟失

 

window.history.go(-1);

3、返回上一頁原頁面 表單中的內容會保留

 

window.history.back();

實例：

1、

 

<input type=button value=刷新 onclick="window.location.reload()">
<input type=button value=前進 onclick="window.history.go(1)">
<input type=button value=后退 onclick="window.history.go(-1)">
<input type=button value=前進 onclick="window.history.forward()">
<input type=button value=后退 onclick="window.history.back()">

2、

 

<a href="javascript:history.go(-1)">返回上一頁</a>
<a href="javascript:location.reload()">刷新當前頁面</a>
<a href="javascript:" onclick="history.go(-2); ">返回前兩頁</a>
<a href="javascript:" onclick="self.location=document.referrer;">返回上一頁並刷新</a>
<a href="javascript:" onclick="history.back(); ">返回上一頁</a>

這里看到了 <a href="javascript:">就說說這個：

 

<a href=”javascript:” onclick=”fun1()” >  </a>
<a href=”javascript: undefined” onclick=”fun1()” >  </a>
<a href=”javascript:void(0)” onclick=”fun1()” >  </a>
這三種方式，要實現的效果是一樣的。即不執行跳轉而是執行對應的函數，而JavaScript：void(0)在頁面內容很多的時候會好一些
而且W3C標准不推薦在href里面執行javascript語句，所以還是用 onclick事件觸發吧，所以我們不要這樣寫：<a href=javascript:function()>  </a>

 

代碼如下:

<span id="tiao">3</span><a href="javascript:countDown"></a>布丁足跡;秒后自動跳轉……<meta http-equiv=refresh content=3;url='/search/billsearch.jsp'</ul> 
<!--腳本開始--> 
<script language="javascript" type=""> 
function countDown(secs){ 
tiao.innerText=secs; 
if(--secs>0) 
setTimeout("countDown("+secs+")",1000); 
} 
countDown(3); 
</script> 
<!--腳本結束--> 

按鈕式： 

<INPUT name="pclog" type="button" value="GO" onClick="location.href='http://www.ddhbb.com/'"> 

鏈接式： 

<a href="javascript:history.go(-1)">返回上一步</a> 
<a href="<%=Request.ServerVariables("HTTP_REFERER")%>">返回上一步</a> 

直接跳轉式： 

<script>window.location.href='http://www.ddhbb.com';</script> 

開新窗口： 

<a href="javascript:" onClick="window.open('http://www.ddhbb.com/blog/guestbook.asp','','height=500,width=611,scrollbars=yes,status=yes')">布丁足跡</a> 

JS跳轉頁面參考代碼 

第一種： 
<script language="javascript" type="text/javascript"> 
window.location.href="login.jsp?backurl="+window.location.href; 
</script> 
第二種： 
<script language="javascript"> 
alert("返回"); 
window.history.back(-1); 
</script> 
第三種： 
<script language="javascript"> 
window.navigate("top.jsp"); 
</script> 
第四種： 
<script language="JavaScript"> 
self.location='top.htm'; 
</script> 
第五種： 
<script language="javascript"> 
alert("非法訪問！"); 
top.location='xx.jsp'; 
</script> 

＝＝＝＝＝javascript中彈出選擇框跳轉到其他頁面＝＝＝＝＝ 
<script language="javascript"> 
<!-- 
function logout()...{ 
if (confirm("你確定要注銷身份嗎？是－選擇確定，否-選擇取消"))...{ 
window.location.href="logout.asp?act=logout" 
} 
} 
--> 
</script> 

＝＝＝＝＝javascript中彈出提示框跳轉到其他頁面＝＝＝＝＝ 
<script language="javascript"> 
<!-- 
function logout()...{ 
alert("你確定要注銷身份嗎？"); 
window.location.href="logout.asp?act=logout" 
} 
--> 
</script>