JavaScript:history.go() 的妙用
阿新 • • 發佈：2018-12-23
在Web開發中，會遇到從一頁（父頁）導向另一頁（子頁），並且要求“返回”父頁的情況，在這裡如果用ASP.NET提供的Response.Redirect()方法，往往不會達到理想的效果，例如：返回後，重新載入了頁面，無法儲存導向子頁前的狀態，等等，在這裡我就介紹一下如何使用JavaScript中history.go()函式來實現返回功能並且儲存住狀態的方法。
這個函式用起來很簡單，只要在頁面上加一個html的input元素，例如：
<input type="button" value="返回">
然後再為這個元素新增onclick屬性，如：
<input type="button" value="返回" onclick="history.go(-1);">
這樣就能達到返回上一頁的效果。但是，往往在實踐中，並沒有這麼簡單，當你在向伺服器提交請求的時候，引起頁面回發，你再用history.go(-1)這招就不靈啦，它在這裡是返回你回發前的狀態，go後面的引數，實際上就是標識你要返回你回發第前n次的狀態，所以只要能記住回發了幾次，就能用history.go(-n)準確地返回到父頁了。
在Web開發中，全域性變數也是存不住的，當頁面回發後，全域性變數的值就會丟失，取而代之的是檢視狀態，所以我們就只能用檢視狀態來記錄回發的次數了。那麼就封裝一個檢視狀態屬性把。
public int returnCount
{
get{
if(ViewState["returnCount"] == null)
ViewState["returnCount"] = 0;
return (int)ViewState["returnCount"];
}
set { ViewState["returnCount"] = value ;}
}
定義好這個後，把他放到Page_Load裡面，讓他每次在頁面回發時減1，這樣就能準確的記住回發了幾次。
protected void Page_Load(object sender, EventArgs e)
{
returnCount--; //要放在!iIsPostBack之外，要不然就僅僅在頁面第一次載入時執行一次，回發時就不執行了。
if(!IsPostBack)
{
}
}
吼吼，到這一步還沒完呢，要把我們封裝的屬性加到Js裡面。如下：
<input type="button" value="返回" onclick="history.go('<% =returnCount %>');">
這下就完美了，管你在頁面上怎麼回發，只要一點這個按鈕，肯定會返回到父業的。
注意：
1、如果在本頁面上有Response.Redirect()到本頁或者類似的情況，那麼就要將returnCount作為查詢字串傳遞一下了，因為這東西在頁面失效時就over了。
2、本文僅對非Ajax的Web系統有作用，Ajax的還沒仔細研究過
這個函式用起來很簡單，只要在頁面上加一個html的input元素，例如：
<input type="button" value="返回">
然後再為這個元素新增onclick屬性，如：
<input type="button" value="返回" onclick="history.go(-1);">
這樣就能達到返回上一頁的效果。但是，往往在實踐中，並沒有這麼簡單，當你在向伺服器提交請求的時候，引起頁面回發，你再用history.go(-1)這招就不靈啦，它在這裡是返回你回發前的狀態，go後面的引數，實際上就是標識你要返回你回發第前n次的狀態，所以只要能記住回發了幾次，就能用history.go(-n)準確地返回到父頁了。
在Web開發中，全域性變數也是存不住的，當頁面回發後，全域性變數的值就會丟失，取而代之的是檢視狀態，所以我們就只能用檢視狀態來記錄回發的次數了。那麼就封裝一個檢視狀態屬性把。
public int returnCount
{
get{
if(ViewState["returnCount"] == null)
ViewState["returnCount"] = 0;
return (int)ViewState["returnCount"];
}
set { ViewState["returnCount"] = value ;}
}
定義好這個後，把他放到Page_Load裡面，讓他每次在頁面回發時減1，這樣就能準確的記住回發了幾次。
protected void Page_Load(object sender, EventArgs e)
{
returnCount--; //要放在!iIsPostBack之外，要不然就僅僅在頁面第一次載入時執行一次，回發時就不執行了。
if(!IsPostBack)
{
}
}
吼吼，到這一步還沒完呢，要把我們封裝的屬性加到Js裡面。如下：
<input type="button" value="返回" onclick="history.go('<% =returnCount %>');">
這下就完美了，管你在頁面上怎麼回發，只要一點這個按鈕，肯定會返回到父業的。
注意：
1、如果在本頁面上有Response.Redirect()到本頁或者類似的情況，那麼就要將returnCount作為查詢字串傳遞一下了，因為這東西在頁面失效時就over了。
2、本文僅對非Ajax的Web系統有作用，Ajax的還沒仔細研究過